当前位置 : 主页 > 网页制作 > JQuery >

使用jQuery / JavaScript获取表单更改选择框的操作

来源:互联网 收集:自由互联 发布时间:2021-06-15
我在网页上有多个表单.我想要更改选择框的表单操作.除隐藏字段外,所有表单都相同.没有类或id可以形成.下面是代码结构. function sortFunction(){ var action = $(this).closest('form').attr('action');
我在网页上有多个表单.我想要更改选择框的表单操作.除隐藏字段外,所有表单都相同.没有类或id可以形成.下面是代码结构.

function sortFunction(){
   var action = $(this).closest('form').attr('action');
   alert(action);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="GET" name="FORM_TYPESH" action="xyz">
   <select name="nShip" onchange="sortFunction()">
     <option value="Any">Select Ship:</option>
     <option value="Any">Any</option>
   </select>
</form>
<form method="GET" name="FORM_TYPESH" action="abc">
   <select name="nShip" onchange="sortFunction()">
      <option value="Any">Select Ship:</option>
      <option value="Any">Any</option>
   </select>
</form>
内联js代码不是一个好习惯.但是,如果您需要这样做,传递以下两个参数很有用:

>这 – >当前元素
>事件 – >事件对象

因此,更改您的代码:

<select name="nShip" onchange="sortFunction()">

至:

<select name="nShip" onchange="sortFunction(this, event)">

片段:

function sortFunction(ele, evt){
  var action = $(element).closest('table').find('form').attr('action');
  console.log(action);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div align="center" width="100%">
    <table class="header" width="100%" id="AutoNumber2">
        <tbody><tr>

            <td width="100%" colspan="2">

                <div align="center">
                    <center>
                        <table width="99%" cellspacing="0" border="0" cellpadding="0">
                            <tbody><tr>
                                <td align="center" colspan="8" width="100%">
                                    <font size="4">Filter your Results</font> </td></tr>
                            <tr>
                                <form method="GET" name="FORM_TYPERG" action="/international/CruisesQuery_EA.asp"></form>
                                <input type="hidden" name="Client" value="airganesha">
                                <input type="hidden" name="CurrentPage" value="1">
                                <input type="hidden" name="nAct" value="">
                                <input type="hidden" name="SORT_TYPE" value="Date Ascending">

                                <form method="GET" name="FORM_TYPELN" action="/international/CruisesQuery_EA.asp"></form>
                                <input type="hidden" name="Client" value="airganesha">
                                <input type="hidden" name="CurrentPage" value="1">
                                <input type="hidden" name="LastPage" value="">
                                <input type="hidden" name="SORT_TYPE" value="Date Ascending">
                                <form method="GET" name="FORM_TYPESH" action="/international/CruisesQuery_EA.asp"></form>
                                <input type="hidden" name="Client" value="airganesha">
                                <input type="hidden" name="CurrentPage" value="1">
                                <input type="hidden" name="LastPage" value="">
                                <input type="hidden" name="elDate" value="20180201">
                                <input type="hidden" name="lsDate" value="20180301">
                                <input type="hidden" name="erlDate" value="01/02/18">
                                <input type="hidden" name="lstDate" value="01/03/18">
                                <input type="hidden" name="line" value="Any">
                                <input type="hidden" name="linename" value="">
                                <input type="hidden" name="nOperator" value="">
                                <input type="hidden" name="Area" value="Anywhere">
                                <input type="hidden" name="Howlong" value="Any">
                                <input type="hidden" name="Standard" value="Any">
                                <input type="hidden" name="QFly" value="Yes">
                                <input type="hidden" name="wheelchair" value="No">
                                <input type="hidden" name="Children" value="No Preference">
                                <input type="hidden" name="Size" value="Any">
                                <input type="hidden" name="Embark" value="Any">
                                <input type="hidden" name="nAct" value="">
                                <input type="hidden" name="SORT_TYPE" value="Date Ascending">


                                <td align="center" width="144">
                                    <div class="styled-select">
                                        <select name="nShip" onchange="sortFunction(this)">

                                            <option value="Any">Select Ship:</option>
                                            <option value="Any">Any</option>
                                            <option value="496">
                                                Adonia			</option>
                                            <option value="243">
                                                Adventure of the Seas			</option>
                                            <option value="474">
                                                Allure of the Seas			</option>
                                        </select>
                                    </div>
                                </td>

                            </tr>
                            </tbody>
                            </table>
                        </center>
                    </div>
        </td>
        </tr>
        </tbody>
        </table>
    </div>
网友评论