jquery动态添加复选框.attr("checked",true)不起作用

2024-04-06

根据一些数据,我使用复选框克隆一个 div,并检查数据值是否为“True”,然后附加到目标 div。

使用jquery 1.5.2

IE8 在兼容模式下工作,在其他模式下不起作用。 FF 不行。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="scripts/jquery-1.5.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {          
            // test data
            var data = [{ "CB": "True" }, { "CB": "False"}];

            var theClone = $("#clone").clone(true);
            var temp = "";

            if (data !== null) {
                $.each(data, function (i, d) {
                    var cb = theClone.find('.cbClass');

                    if (d.CB === "True") { 
                        //cb.attr("checked","checked"); //doesn't work
                        //cb.val(true); //doesn't work
                        //cb.attr("checked", true); //doesn't work

                    }

                    temp += theClone.html();
                });
            }
            $("#target").append(temp);    
        });
    </script>
</head>
<body>
<div id="target">
    <div id="clone" class="cloneClass" style="display:none">
    <div class="container">
        <input type="checkbox" class="cbClass" />
    </div>
</div>
</div>

</body>
</html>

试试这个,看来使用.attr("checked", "checked")不影响html,尝试使用直接的javascript方法setAttribute and removeAttribute

$.each(data, function(i, d) {
    var cb = theClone.find('.cbClass');
    if (d.CB === "True") {
        cb.get()[0].setAttribute("checked", "checked");
    }
    else{
         cb.get()[0].removeAttribute("checked");
    }
    temp += theClone.html();
});

另请注意,因为您始终与theClone你需要使用removeAttribute因为上一次迭代修改了该元素。

jsfiddle 上的代码示例 http://jsfiddle.net/markcoleman/q88gw/

Update

如果您直接处理 jQuery 对象,它似乎可以在 IE9、chrome、FF 和 IE 兼容模式下工作。

var temp = [];

if (data !== null) {
    $.each(data, function(i, d) {
        var theClone = $("#clone div").clone(true);
        var cb = theClone.find('.cbClass');
        if (d.CB === "True") {
            cb.attr("checked", "checked");
        }
        temp.push(theClone);
    });
}

$.each(temp, function(i, item) {
    $("body").append(item);
});

jsfiddle 上的代码示例 http://jsfiddle.net/markcoleman/q88gw/2/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery动态添加复选框.attr("checked",true)不起作用 的相关文章

  • Javascript 使事件点击和语音识别与多个按钮一起工作

    所以我正在使用 webkitSpeechRecognition 并且它工作得很好 但问题是我想同时在多个地方使用它 当我将它添加到页面上的另一个部分时 它无法正常工作 这是它自己工作的情况 var final transcript var
  • 像在 tumblr 注册页面上那样鬼写

    有谁知道如何创建一个类似 tumblr 的字段 http www tumblr com http www tumblr com 这是一个 URL 字段 其中有一些褪色的文本 然后当您单击它并键入时 它会附加一些文本 tumblr com 您
  • 如何在通过 .ajaxForm() 提交表单之前执行一些操作?

    我正在使用 ajaxForm 框架来发送我的数据 而无需重新加载我的页面 ReplayForm ajaxForm success function data alert Success 现在 我想在提交表单之前检查一些条件 如果条件为假 则
  • 使用 jQuery Select2 清除下拉菜单

    我正在尝试使用奇妙的方式以编程方式清除下拉菜单Select2 http ivaynberg github com select2 图书馆 使用 Select2 远程 ajax 调用动态填充下拉列表query option HTML
  • Rails 3:如何让用户在表单中至少选择一个复选框?

    我有一个表单 用户在提交表单之前必须选中至少一个复选框 有没有任何插件可以处理这个问题或者jquery可以应用于我的表单 不幸的是我完全是一个 jquery 菜鸟 上面的所有答案都显示了如何在客户端执行此操作 这确实可能更好 正如您的问题标
  • 如何使用javascript进行相对路径重定向?

    我正在一个基于 php 的网站中处理 javascript jquery 并且我必须在页面中发生事件时重定向页面 可以说 点击按钮 点击我 page1 php 页面应重定向到 page2 php 这个重定向必须使用 javascript j
  • 是否可以使用 jQuery .on 和悬停?

    我有一个 ul 在初始页面加载后用 javascript 填充 我目前正在使用 bind with mouseover and mouseout 该项目刚刚更新到 jQuery 1 7 所以我可以选择使用 on 但我似乎无法让它工作hove
  • jQuery 变量在定义时声称它是未定义的

    我试图在同一页面上有两个自动填充文本框 一个用于手机型号 input1 一个用于固件 input2 当两者都填充时 我希望显示一个带有ID input1input2 的div 但是当在input1 中输入值时 它声称phone 的变量未定义
  • 从旧的外部 Javascript 更改 React 组件的状态?

    如何从旧的 jQuery soup 中更改 React 组件的状态 代码 我有一个这样的组件 var AComponent React createClass getInitialState function return ids rend
  • jQuery Mobile showPageLoading Msg()/hidePageLoading Msg() 方法在初始页面加载时不起作用

    我正在使用 jQuery Mobile 编写一个 Web 应用程序 该应用程序调用一个函数将记录加载到 localStorage 中 并在最初创建页面时从远程 JSON 文件创建列表视图 使用live pagecreate 页面的事件 该函
  • Bootstrap Affix Nav 导致下面的 Div 向上跳转

    我使用 Bootstrap 的 Affix 函数创建了一个 JSFiddle 以便在向下滚动并且标题移出视图时使导航保持在屏幕顶部 我遇到的问题是 当使用纯 HTML 时 导航下方的文本会过早地跳起来并隐藏在导航后面 查看有问题的代码her
  • 动态添加案例到交换机

    我需要动态地将案例添加到交换机 我希望用户能够添加项目 并且每个项目都需要它自己的开关盒 您可以使用带有回调函数的对象 You can have initial cases var callbacks something gt 42 and
  • 我希望 jQuery 验证器向表单元素的父级添加一个类

    我该如何使用jQuery 验证器 http docs jquery com Plugins Validation添加 删除类名 例如validate 在表单元素的父元素上 li 这样我就可以通过仅设置一个类名来设置与该元素相关的所有内容的样
  • 如何在bootstrap中默认隐藏侧边栏?

    我在这里有一个很好的参考 作为 Bootstrap 在设计 Web 表单应用程序时的侧边栏 http startbootstrap com template overviews simple sidebar http startbootst
  • 您可以将现有的 div 复制到模式对话框吗

    我有一个带有多个面板的仪表板来显示不同的信息 我希望能够添加一个按钮来以模式显示面板 我正在使用引导程序 我所能找到的只是已经编写的模态 我想复制作为面板的 div 标签的内容 然后将其显示在模型中 但我不确定如何进行 该面板的 html
  • 实现悬停信息框

    我有一个日历 当用户将鼠标悬停在单元格上时 会出现一个很大的信息框 其中包含该日期的详细信息 虽然当用户离开时使信息框消失 但我遇到了一些麻烦 我基本上想要它 这样当鼠标光标移出信息框隐藏的日历单元格时 它就会消失 但我遇到了麻烦 因为mo
  • jQuery 中的 $('') 与 $('')

    我看到人们以两种不同的方式在 jQuery 中创建 HTML 元素
  • 如何使用 jQuery Ajax 将 PHP 数组值传递到另一个文件?

    这是我的代码
  • Django 将 JSON 数据传递给静态 getJSON/Javascript

    我正在尝试从 models py 中获取数据并将其序列化为views py 中的 JSON 对象 模型 py class Platform models Model platformtype models CharField max len
  • 用javascript调用外部网页(跨域)

    我正在尝试使用以下网络服务来验证提要这个问题 https stackoverflow com questions 11996430 check if a url is a valid feed 但浏览器不允许我向另一台服务器发送 ajax

随机推荐