1

我试图在 JQuery UI 对话框中调用 changeShowTips() 方法，但是该方法总是返回“未检查！！！”

似乎是什么问题？

    <div id="dialog-tip">
        <div>
            <input type="checkbox" name="showTips" value="showTips" checked="checked" onclick="changeShowTips();"/>Show tips on start up
        </div>
    </div>

    <script type="text/javascript">
        $(document).ready(function () {
            showTips()
        });


        function showTips() {
            $("#dialog-tip").dialog({
                height: 520,
                width: 515,
                modal: true,
            }).parents('.ui-dialog:eq(0)').wrap('<div class="black-tie"></div>');             
        }

        function changeShowTips() {
            if (showTips.checked == true) {
                alert('checked!!!');
            }
            else {
                alert('NOT checked!!!');
            }
        }

    </script>
4

4 回答 4

2

那是因为在您的代码showTips中指的是您的函数而不是目标元素。

<input type="checkbox" 
       name="showTips" 
       value="showTips" 
       checked="checked" 
       onclick="changeShowTips(this);"
/> Show tips on start up


function changeShowTips(showTips) {
     if (showTips.checked) {
         alert('checked!!!');
     }
     else {
         alert('NOT checked!!!');
     }
}

http://jsfiddle.net/n74JG/

于 2012-09-29T13:32:45.320 回答
2

你有一些乱七八糟的 jQuery

 <div id="dialog-tip">
    <div>
        <input type="checkbox" name="showTips" value="showTips" checked="checked"/>Show tips on start up
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        showTips()

        $('input', '#dialog-tip').click(changeShowTips()); // do not have inline js, bind it here
    });


    function showTips() {
        $("#dialog-tip").dialog({
            height: 520,
            width: 515,
            modal: true,
        }).parents('.ui-dialog').eq(0).wrap('<div class="black-tie"></div>');       
        // it is faster for sizzle to use a standard css selector to modify the jquery object and then use a jquery specific selector 'eq' separately
        // instead of combining css/jquery selectors in one statement      
    }

    function changeShowTips() {
        if ($('input', '#dialog-tip').is(':checked')) { // there is jQuery for this - you should also compare and not assign
            alert('checked!!!');
        }
        else {
            alert('NOT checked!!!');
        }
    }

</script>
于 2012-09-29T13:27:48.050 回答
1

试试这个...

给输入一个 showTips 的 id 以及名称然后......

    function changeShowTips() {
        if ($('#showTips').is(':checked')) {
            alert('checked!!!');
        }
        else {
            alert('NOT checked!!!');
        }
    }
于 2012-09-29T13:23:54.783 回答
0

从语法上看，您似乎正在尝试使用 vanilla JS 而不是 jQuery 来检查复选框。

一个 jQuery 选择器看起来像这样 $([...])，通常你用它来选择类 $(".someclass") 或 ids $("#someid")。如果您真的不想为输入字段提供 ID，请查看文档：http ://api.jquery.com/attribute-equals-selector/

然后你可以使用 $([...]).prop("checked") 来确定它是否被选中。

于 2012-09-29T13:29:22.533 回答