6

这里正在使用 jquery 复选框单击功能,如果我单击 IE 9 中的复选框, if ($(this).is(':checked')) 它不会抛出警报消息..但它在 IE 10、firefox 和 chrome 中工作

if (isChildAvail == "true") 
{
    $(this).change(function() {
            if ($(this).is(':checked')) {
            alert("test");
            $(this).parent().parent().append('<div id="divedit" class="editdiv"><p id="p_childlabel" class="childlabel">Children : ' + ChilAvailCount + '   </P><a class="childlabeledit">Edit</a></div>');
            $('.editdiv a').click(function() {
            $(this).parent().parent().append($("#divchildcontrol"));
            EditForPullups();
         });
         }
  }

有什么建议吗??

编辑:

 $(this).change(function() { 

问题在于更改功能而不是这个if ($(this).is(':checked'))

编辑(2):

var strCheck = "";
$('.consumer-communication-checkbox').each(function () {

        strCheck = $(this).parent().text();


        if (strCheck.toLowerCase().indexOf("hugg") >= 0) {

            //scenario without child
            if (isChildAvail == "false") {
                jQuery(':checkbox').change(function () {
                    if ($(this).prop('checked') === true) {
                        $(this).parent().parent().append($("#divchildcontrol"));
                        IsChildcontrolwithH = "1";
                        IsChildcontrolwithG = "0";
                        IsChildcontrolwithP = "0";
                    } else {
                        if (IsChildcontrolwithH == "1") {
                            $("#divpersonalrightheader").append($("#divchildcontrol"));
                        }
                    }
                });
            }
            //scenario with child
            else {
                if ($(this).prop('checked') === true) {
                    //Set SubscribedCode
                    SubscribedCode = "H";
                    $(this).parent().parent().append('<div id="divedit" class="editdiv"><p id="p_childlabel" class="childlabel">Children : ' + ChilAvailCount + '   </P><a class="childlabeledit">Edit</a></div>');
                    $('.editdiv a').click(function () {
                        $(this).parent().parent().append($("#divchildcontrol"));
                        EditForH();
                    });
                }

                jQuery(':checkbox').change(function () {
                    if ($(this).prop('checked') === true) {
                        $(this).parent().parent().append('<div id="divedit" class="editdiv"><p id="p_childlabel" class="childlabel">Children : ' + ChilAvailCount + '   </P><a class="childlabeledit">Edit</a></div>');
                        $('.editdiv a').click(function () {
                            $(this).parent().parent().append($("#divchildcontrol"));
                            EditForH();
                        });
                    } else {
                        $("#divedit").remove();
                        if (IsChildcontrolwithH == "1") {
                            $("#divpersonalrightheader").append($("#divchildcontrol"));
                            IsChildcontrolwithH = "0";
                            IsChildcontrolwithG = "0";
                            IsChildcontrolwithP = "0";
                        }
                    }

                });
            }
        }

编辑(3):HTML内容

   <div class="consumer-checkbox-wrap checked">
                <label class="consumer-communication-label checkbox" for="communication_11">
                    <input name="communication_11" class="consumer-communication-checkbox checkbox" id="communication_11"
                        type="checkbox" checked="checked" value="true"><img src="Images/PMURP_Logos/hugg.jpg">
                s
                    <p>
                        Please send me communications, savings, and special offers from hugg® Communications
                    </p>
                </label>
                <input name="communication_11" type="hidden" value="false"><a href="http://www.hugg.com/email/12162011/SampleNewsletter.html"
                    target="_blank"><img src="../kcsso/images/Newsletter/hugg.jpg"></a>
</div>
 <div class="consumer-checkbox-wrap">
            <label class="consumer-communication-label checkbox" for="communication_13">
                <input name="communication_13" class="consumer-communication-checkbox checkbox" id="communication_13"
                    type="checkbox" value="true"><img src="Images/PMURP_Logos/scott.jpg">

                <p>
                    Please send me communications, savings, and special offers from scott® Communications</p>
            </label>
            <input name="communication_13" type="hidden" value="false"><a href="http://www.scott.com/email/11042011/samplenewsletter.html"
                target="_blank"><img src="../kcsso/images/Newsletter/scott.jpg"></a>
</div>
4

5 回答 5

6

The code you posted is missing a few closing brackets at the end, I'm not sure if you simply didn't copy/paste it all, or if it's missing and breaking your code:

This is what you posted (after tidying up indentation):

if (isChildAvail == "true") {
    $(this).change(function () {
        if ($(this).is(':checked')) {
            alert("test");
            $(this).parent().parent().append('<div id="divedit" class="editdiv"><p id="p_childlabel" class="childlabel">Children : ' + ChilAvailCount + '   </P><a class="childlabeledit">Edit</a></div>');
            $('.editdiv a').click(function () {
                $(this).parent().parent().append($("#divchildcontrol"));
                EditForPullups();
            });
        }
    }

It is missing the end of the change event handler ); as well as the closing bracked for the if block }:

if (isChildAvail == "true") {
    $(this).change(function () {
        if ($(this).is(':checked')) {
            alert("test");
            $(this).parent().parent().append('<div id="divedit" class="editdiv"><p id="p_childlabel" class="childlabel">Children : ' + ChilAvailCount + '   </P><a class="childlabeledit">Edit</a></div>');
            $('.editdiv a').click(function () {
                $(this).parent().parent().append($("#divchildcontrol"));
                EditForPullups();
            });
        }
    });
}

This (simplified) example works fine for me in IE9: http://jsfiddle.net/rT2dT/1/

$(':checkbox').change(function () {
    if ($(this).is(':checked')) {
        alert("test");
    }
});

Alternatively, try

$(':checkbox').change(function () {
    if ($(this).prop('checked') === true) {
        alert("test");
    }
});

Which jQuery version are you using?

EDIT: Following up on your 2nd edit from above:

I see that you are attaching event handlers in an each loop

$('.consumer-communication-checkbox').each(function () {

I assume that that selector will be on various checkboxes on your page. Inside that each look, you attach change handlers like so:

$(':checkbox').change(...

This selector will give you all the checkboxes on the entire page, not just the one in scope. In each iteration of the each loop you are attaching one of those event handlers to every checkbox on the page. Without knowing your HTML markup, I can't tell you what is happening exactly, but this will be the reason why everything works as expected in isolated examples (like as JSFiddle.net) and returns random results in context.

于 2013-07-29T09:20:12.603 回答
3

尝试替换$jQuery. 也许我错了,但看起来另一个库正在覆盖$机制并导致未定义的方法调用。


更新更新:

所以这是没有按预期工作的部分:

//else {
    $("#divedit").remove();
    if (IsChildcontrolwithH == "1") {
        $("#divpersonalrightheader").append($("#divchildcontrol"));
        IsChildcontrolwithH = "0";
        IsChildcontrolwithG = "0";
        IsChildcontrolwithP = "0";
    }
//}

没有什么问题。

但是,如果此时不存在 ID 为 divpersonalrightheader 的元素或 ID 为 divchildcontrol 的元素,则不会执行任何操作当然,我假设您的带有变量的逻辑内容是正确的。删除这些变量以避免处理许多类似标志的变量可能是一个好主意。如果需要在元素周围放置一些数据,可以使用.IsChildcontrolwith*$(...).data()

于 2013-07-29T08:02:13.570 回答
2

只是添加了我赞成的 UweB 的答案。IE9 和其他版本在语法方面非常挑剔,而其他浏览器会根据它们的含义忽略某些杂散的逗号或括号。

于 2013-07-29T22:01:44.277 回答
1

如果它仍然不起作用,那么您可以使用 jquery browser detect 来跟踪您的错误,这是一种非常简单的方法来找出任何特定脚本在特定浏览器中是否正常工作。

通过 Js/Jquery 检测浏览器的代码如下:

if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1){ //你的消息来了}

此代码仅适用于 Chrome 浏览器,您可以为任何浏览器(台式机、移动设备或平板电脑)定义它

于 2013-08-05T07:23:11.300 回答
1

is(":checked")在 IE9 中使用and应该没有问题$.change,因为您正在使用的 jQuery 版本都支持这两者(而且我认为在这件事上可以使用任何版本)。

由于您没有提供您使用的 HTML 结构,因此我根据 EDIT(2) 中的脚本创建了一些假设。

  1. 有几个复选框,每个都有这个类consumer-communication-checkbox
  2. 这些复选框中的每一个都包装在一个父元素中。(我用于div我的样本)。
  3. 您正在尝试在这些复选框上绑定更改事件(isChildAvail真或假),但仅当父容器具有包含“hugg”的文本时。
  4. 您还想为文档正确加载并准备就绪时检查的复选框执行逻辑。

有了这些假设,我创建了类似于你的简单代码:http: //jsfiddle.net/9FtjU/3/

HTML 是根据我上面的第一个和第二个假设编码的。JavaScript 只是您的简化版本。在脚本中,我引入了变量isChildAvail;你可以改变它的值来复制不同的结果。

问题可能是您将change事件绑定到所有复选框。

我进一步简化了它(使用我的第 3 和第 4 个假设)以将更改事件与迭代分开:http: //jsfiddle.net/ub7kS/1/

我测试了上面提供的两个 jsfiddle 链接,并且都在 IE9 中工作。

===

在另一个问题上,您可能还想检查您的点击事件处理程序$('.editdiv a')

更新

我编辑了上面的两个 jsfiddle 链接。这与您的脚本类似:http: //jsfiddle.net/hunLQ/ 这是具有分离的更改事件处理程序和迭代的脚本:http: //jsfiddle.net/hunLQ/1/

随意修改和使用任何一个作为指南。只需根据alert您的逻辑更改。

于 2013-08-05T07:17:07.473 回答