获取 id 和 value 动态创建的元素 jquery答案

【问题标题】：get id and value dynamically created element jquery获取 id 和 value 动态创建的元素 jquery
【发布时间】：2014-09-26 06:55:40
【问题描述】：

我需要我之前在 ajax 事件上创建的跨度的 id（和其他属性，例如值）。有没有办法做到这一点？

这是在 php post 上创建 span 的方式：

    echo "<span class='non-skin-symptom-choice disease_option' ".
        "onclick='showinfo(".$var[0].");' id=".$var[0].">"
        .$var[1]." -- ".number_format($var[3]*100, 2, '.', '')."%</span>";

我想在点击复选框时获取它的 ID。

    $(".chb").click(function(){

        var id= $(this).attr('id');
        var list=[];

        $('.disease_option').each(function (){
            alert("this.val=="+ $(this).attr("val"));        //i need the value here
            var str= $(this).attr("value").split(" -- ")[1];
            alert(str);
            str=str.slice(0,str.length - 1);
            if(parseFloat(str) >=support)
                list.push(id)                                //i need the id here
        });

复选框不是动态创建的，因此 $(".chb").click(function(){} 有效。

不知何故，$(this).attr("id") 有效，但 $(this).attr("val") 返回未定义...我也尝试过 $(this).attr("value") 但相同结果。 $(this).val 返回空。

【问题讨论】：

$(".non-skin-symptom-choice").attr("id");
@Tauri28 - 假设只有一个 .non-skin-symptom-choice 可能不是这种情况（或者他们不需要那个特定的 id）。
你的 .chb 类在哪里？
@Kartikeya 这里需要什么事件委托？？你读过问题吗？
第一：永远不要使用$(this).attr("id")，只使用this.id（你不必为所有的东西使用jQuery...），第二：在哪里你需要得到id？在您使用onclick 或其他地方调用的函数中？第三：显示 html，而不是 php（与在浏览器中运行的 JavaScript 无关*）。（*我知道服务器端 JavaScript，你没有使用它。）

标签： javascript php jquery ajax

【解决方案1】：

使用

$(document).on('click','.chb',function(){
  var id = $(".non-skin-symptom-choice").attr("id"); 
})

因为它有一个高级事件附件，它可以获取在运行时创建的元素

【讨论】：

复选框不是动态创建的。不知何故， $(this).attr("id") 有效，但 $(this).attr("val") 返回未定义...我也尝试过 $(this).attr("value") 但结果相同。 $(this).val 返回空值。
因为 span 没有 value 属性使用这个 var value = $(".non-skin-symptom-choice").html();
啊...这就是原因。谢谢。 .html();应该管用。 0:)

【解决方案2】：

试试这个

alert($(".non-skin-symptom-choice").attr("id"));

【讨论】：

【解决方案3】：

您正在使用的 click() 绑定称为“直接”绑定，它只会将处理程序附加到已存在的元素。它不会绑定到将来创建的元素。为此，您将使用 on()

创建一个“委托”绑定

$(document).on('click','.chb',function(){
  var id = $(".non-skin-symptom-choice").attr("id"); 
})

可能重复：Click event doesn't work on dynamically generated elements

【讨论】：

【解决方案4】：

如果您的 DOM 节点在页面加载时不存在（即在页面加载后通过 AJAX 添加到页面），如果您尝试更新它或使用 jQuery 方法读取它，jQuery 将无法看到它。解决此问题的一种方法是设置您的 jQuery 函数以引用您要定位的节点的父节点的类或 ID（假设父类在页面加载时加载到页面中）以及节点的类你想瞄准。例如：

$(".chb").click(function(){
    var id = $(".your-parent-class .non-skin-symptom-choice").attr("id");
    }
}

【讨论】：