jQuery获取select onChange的值

我的印象是，我可以通过执行这个$(this).val()来获取一个选择输入的值;并将onchange参数应用到select字段。

只有在引用ID时，它才会起作用。

我怎么用这个。

当前回答

箭头函数的作用域与函数不同，这一点。Value将为箭头函数提供undefined。固定使用

$('select').on('change',(event) => {
     alert( event.target.value );
 });

2018-08-16 13:01:47

其他回答

我的印象是，我可以得到一个选择的值输入$(this).val();

如果你不引人注目地订阅(这是推荐的方法)，这是有效的:

$('#id_of_field').change(function() {
    // $(this).val() will work here
});

如果你在脚本中使用onselect和mix标记，你需要传递一个引用到当前元素:

onselect="foo(this);"

然后:

function foo(element) {
    // $(element).val() will give you what you are looking for
}

2012-06-24 17:03:51

jQuery获取在Change事件上使用select html元素的值

演示和更多的例子

$(document).ready(function () { $('body').on('change','#select_box', function() { $('#show_only').val(this.value); }); }); <!DOCTYPE html> <html> <title>jQuery Select OnChnage Method</title> <head> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> </head> <body> <select id="select_box"> <option value="">Select One</option> <option value="One">One</option> <option value="Two">Two</option> <option value="Three">Three</option> <option value="Four">Four</option> <option value="Five">Five</option> </select> <br><br> <input type="text" id="show_only" disabled=""> </body> </html>

2019-04-22 17:10:38

试试这个,

$('选择')。On ('change'， function() { 警报(这。值); })； < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> <选择> <选项值= " 1 " > < / >选项之一 <选项值= " 2 " > 2 > < /选项 < /选择>

你也可以引用onchange event-

函数getval(选取) ｛警报(sel.value); ｝ <选择onchange = " getval(这个);" > <选项值= " 1 " > < / >选项之一 <选项值= " 2 " > 2 > < /选项 < /选择>

2012-06-24 17:02:49

我想补充一点，谁需要完整的自定义头功能

   function addSearchControls(json) {
        $("#tblCalls thead").append($("#tblCalls thead tr:first").clone());
        $("#tblCalls thead tr:eq(1) th").each(function (index) {
            // For text inputs
            if (index != 1 && index != 2) {
                $(this).replaceWith('<th><input type="text" placeholder=" ' + $(this).html() + ' ara"></input></th>');
                var searchControl = $("#tblCalls thead tr:eq(1) th:eq(" + index + ") input");
                searchControl.on("keyup", function () {
                    table.column(index).search(searchControl.val()).draw();
                })
            }
            // For DatePicker inputs
            else if (index == 1) {
                $(this).replaceWith('<th><input type="text" id="datepicker" placeholder="' + $(this).html() + ' ara" class="tblCalls-search-date datepicker" /></th>');

                $('.tblCalls-search-date').on('keyup click change', function () {
                    var i = $(this).attr('id');  // getting column index
                    var v = $(this).val();  // getting search input value
                    table.columns(index).search(v).draw();
                });

                $(".datepicker").datepicker({
                    dateFormat: "dd-mm-yy",
                    altFieldTimeOnly: false,
                    altFormat: "yy-mm-dd",
                    altTimeFormat: "h:m",
                    altField: "#tarih-db",
                    monthNames: ["Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran", "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık"],
                    dayNamesMin: ["Pa", "Pt", "Sl", "Ça", "Pe", "Cu", "Ct"],
                    firstDay: 1,
                    dateFormat: "yy-mm-dd",
                    showOn: "button",
                    showAnim: 'slideDown',
                    showButtonPanel: true,
                    autoSize: true,
                    buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
                    buttonImageOnly: false,
                    buttonText: "Tarih Seçiniz",
                    closeText: "Temizle"
                });
                $(document).on("click", ".ui-datepicker-close", function () {
                    $('.datepicker').val("");
                    table.columns(5).search("").draw();
                });
            }
            // For DropDown inputs
            else if (index == 2) {
                $(this).replaceWith('<th><select id="filter_comparator" class="styled-select yellow rounded"><option value="select">Seç</option><option value="eq">=</option><option value="gt">&gt;=</option><option value="lt">&lt;=</option><option value="ne">!=</option></select><input type="text" id="filter_value"></th>');

                var selectedOperator;
                $('#filter_comparator').on('change', function () {
                    var i = $(this).attr('id');  // getting column index
                    var v = $(this).val();  // getting search input value
                    selectedOperator = v;
                    if(v=="select")
                        table.columns(index).search('select|0').draw();
                    $('#filter_value').val("");
                });

                $('#filter_value').on('keyup click change', function () {
                    var keycode = (event.keyCode ? event.keyCode : event.which);
                    if (keycode == '13') {
                        var i = $(this).attr('id');  // getting column index
                        var v = $(this).val();  // getting search input value
                        table.columns(index).search(selectedOperator + '|' + v).draw();
                    }
                });
            }
        })

    }

2018-12-17 13:09:38

这对我来说很管用。我尝试了其他所有方法，但都没有成功:

<html>

  <head>
    <title>Example: Change event on a select</title>

    <script type="text/javascript">

      function changeEventHandler(event) {
        alert('You like ' + event.target.value + ' ice cream.');
      }

    </script>

  </head>

  <body>
    <label>Choose an ice cream flavor: </label>
    <select size="1" onchange="changeEventHandler(event);">
      <option>chocolate</option>
      <option>strawberry</option>
      <option>vanilla</option>
    </select>
  </body>

</html>

摘自Mozilla

2016-01-25 22:11:25

jQuery获取select onChange的值

推荐文章

最新文章

标签