Question

我的代码功能是用户在下拉列表中选择一个选项。它将根据所选用户加载一个php文件。

<html>

<head>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
$('#dropdownopt').change(function(){
    var selectedValue = $(this).val();
    if (selectedValue === "1"){
        $("#maindivv").load("iteratemonths.php");
    }
});
</script>
</head>

<body>
<form><select id = "dropdownopt">
<option value = ""></option>
<option value = "1">iteratemonths</option>
<option value = "2">test</option>
</select>
</form>
<br>
<div id="maindivv"></div>
</body>
</html>

我无法弄清楚我的代码是什么问题。如果我选择iteratemonths它只显示空白页面，即使我仔细检查iteratemonths.php存在。先谢谢

Answer 1

//试试这个你忘了.ready（）方法

$(document).ready(function(){  
$('#dropdownopt').change(function(){
    var selectedValue = $(this).val();
    if (selectedValue === "1"){
        $("#maindivv").load("iteratemonths.php");
    }
});
});

Answer 2

第1名将jquery code打包到document.ready内。

第二名：为什么您的代码无法正常工作意味着您尝试bind之前的event到element available。所以它不起作用。

<script>
$(document).ready(function(){
  $('#dropdownopt').change(function(){
      var selectedValue = $(this).val();
      if (selectedValue === "1"){
         $("#maindivv").load("iteratemonths.php");
      }
  });
});

Answer 3

＆＃13;

$(function(){
$('#dropdownopt').on('change',function(){
    var selectedValue = $('#dropdownopt option:selected').val();
    if (selectedValue === "1"){
    console.log('matched!');
    }
    
    console.log(selectedValue);
});

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id = "dropdownopt">
<option value = ""></option>
<option value = "1">iteratemonths</option>
<option value = "2">test</option>
<option value = "3">test3</option>
<option value = "4">test4</option>
<option value = "5">test5</option>
</select>

＆＃13;

尝试这样的方式。我希望它可以帮到你

JQuery .change（）不使用下拉列表

3 个答案: