Question

所以基于这个例子：http://jsfiddle.net/RhnvU/我试图将单选按钮的值传递到一个基本上位于模态框内的区域。但这就是问题，我正在使用一个函数来显示下拉框的结果。

当我使用此代码时：

<script type="text/javascript">
$(function(){
    $('#rental input').on('change', function() {
       alert($('input[name=radioName]:checked', '#rental').val()); 
    });
});
</script>

然后将此代码放在div中的任何位置，它可以正常工作：

echo ' <input type="radio" name="radioName" value="' . $rest . '" />' . $format_number . '<br>';

但是一旦我尝试将它放入这个div：

<div id="txtHint"></div>

这是将PHP脚本的结果返回到该div（id =“txtHint”）的内容，它不起作用。我试图修改$（'＃rental输入以匹配txtHint div id标签，但这似乎不起作用。那么我做错了什么呢？

由于

修改

这是调用api并将数据返回到txtHint div的代码

   function showUser(str){
     if (str==""){
           document.getElementById("txtHint").innerHTML="";
           return;
     } 
     if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
     }
     else{ // code for IE6, IE5
         xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
     xmlhttp.onreadystatechange=function(){
       if (xmlhttp.readyState==4 && xmlhttp.status==200){
           document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
      }
        xmlhttp.open("GET","api/api-test.php?q="+str,true);
        xmlhttp.send();
    }

Answer 1

根据您的评论，您正在尝试将事件附加到通过ajax响应注入的HTML。

初始document.ready代码不起作用，因为这些元素实际上还不存在。有两种方法可以解决这个问题：

您可以在注入ajax响应后附加事件：

$.get(url, function(resp){
  // insert the new div
  $('#rental input').change( // ...code here
});

或者您可以使用委托来收听当前和新事件：

$('#rental').on('change', 'input', function() {

（假设id="rental"已经在页面上。重点是将委托事件附加到一个常量的容器，它总是在页面上。有些人只是使用body来表示重ajax页面）

Jquery onselect onchange单选按钮值

1 个答案: