Question

编辑：对不起，我很累，代码在写这里的时候实际上正在工作！ WTF：D

我在同一页面上有很多不同的下拉菜单，并且当它们发生变化时不想做AJAX请求。

如果我这样做，它就有效：

  $(document).on('change', '#changeresponsibleuser', function(){
    var user = $(this).val();
    var partnerid = $(this).attr('name');
           $.ajax({
              type: "POST",
              url: "resources/dialogs/editResponsibleUser.php",
              data: {user: user,
                     partnerid: partnerid},
              success: function(msg){
                    $('.productmessage').html(msg).hide().fadeIn(500).fadeOut(4000);

                  },
                });
  });

但是我在页面上的所有下拉框中都有这个trickers。我不想做这样的事情：

  $(document).ready(function(){
  $("#changeresponsibleuser").on('change',function(){
    var user = $(this).val();
    var partnerid = $(this).attr('name');
           $.ajax({
              type: "POST",
              url: "resources/dialogs/editResponsibleUser.php",
              data: {user: user,
                     partnerid: partnerid},
              success: function(msg){
                    $('.productmessage').html(msg).hide().fadeIn(500).fadeOut(4000);

                  },
                });

      });
  });

所以它只收听具有该确切ID的下拉列表。但它不起作用，不会触发on change事件。

如果#changeresponsibleuser更改，我该如何触发事件？

标记看起来像这样：

<select id="changeresponsibleuser" name="2" class="responsible2 form-control form-group">

<option name="user" value="36" selected="selected">One user</option>
<option name="user" value="41">Another user</option>
<option name="user" value="40">yet another user</option>
</select>

提前致谢！

Answer 1

$(function(){
 $("#changeresponsibleuser").on('change', function(){
   alert("Works");
 })
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="changeresponsibleuser" name="2" class="responsible2 form-control form-group">

<option name="user" value="36" selected="selected">One user</option>
<option name="user" value="41">Another user</option>
<option name="user" value="40">yet another user</option>
</select>

有效。怎么说它不起作用？

但是我在页面上的所有下拉框中都有这个trickers

没有。你必须使用类名而不是id。看来你正在使用重复的ID。因此它会触发所有具有重复ID的选择下拉列表。

$(document).on('change', '.changeresponsibleuser',function(){
   alert("Works");
 });

它将触发所有具有类changeresponsibleuser

的下拉列表更改

Answer 2

您是否使用AJAX加载ID为changeresponsibleuser的下拉列表？如果您这样做，则意味着下拉列表不适用于文档就绪的绑定更改事件。相反，您可以使用 - select onchange="function_name()"

您可以在此函数中编写ajax请求。

Answer 3

您的加价：

<select id="changeresponsibleuser" name="2" class="responsible2 form-control form-group">
    <option name="user" value="36" selected="selected">One user</option>
    <option name="user" value="41">Another user</option>
    <option name="user" value="40">yet another user</option>
</select>

你的js喜欢：

$(function() {
    $("#changeresponsibleuser").change(function() {
        // do your stuff
    });
});

不要忘记在标记中包含jQuery lib。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

jquery .on（更改）特定ID

3 个答案: