0

私はこれを通常のWebページで使用してきました（そして動作します/動作しました）が、Jquery（v1.9.1 + jquery mobile v 1.2.0 - ボタンのスタイリングやその他の機能用）をアタッチしようとすると、選択するようです正しいオブジェクト (console.log を実行して、配列内で取得されたアイテムを確認) が、「true」の値を返すにもかかわらず、ページのチェックボックスを更新しません (チェック済みにします)。ここで jsFiddle の基本を実行するだけでも同じことができます: http://jsfiddle.net/artcase_1/6sasA/2/

function checkUncheck(name, setTo) {


    var c = document.getElementsByName(name);

    for (var i = 0; i < c.length; i++) {

        if (c[i].type == 'checkbox' || c[i].checked == 'false') {

            c[i].checked = setTo;
        }
    }
}

<!-- in the body: -->
<div data-role="fieldcontain">
    <fieldset data-role="controlgroup" data-type="horizontal">
        <legend>choose a level to view</legend>
        <input name="colors" type="checkbox" class="custom"
        id="redbtn" value="red" checked="checked" />
        <label for="redbtn">High</label>
        <input name="colors" type="checkbox" class="custom" id="yellowbtn"
        value="yellow" />
        <label for="yellowbtn">Med</label>
        <input name="colors" type="checkbox" class="custom" id="bluebtn"
        value="blue" />
        <label for="bluebtn">Low</label>
    </fieldset>
</div>
<input name="Show_all_btn" type="button" id="showall" onclick="checkUncheck('colors','true')"
value="check all" />
4

1 に答える 1

1

JavaScript を HTML から分離することをお勧めします。これにより、更新された js は次のようになります。

var check_all = document.getElementById('showall');

function checkUncheck(name, setTo) {


var c = document.getElementsByName(name);

for (var i = 0; i < c.length; i++) {

    if (c[i].type == 'checkbox' || c[i].checked == 'false') {

        c[i].checked = setTo;
    }
}

}
check_all.addEventListener('click', checkUncheck.bind(null, 'colors', true), false);

これがデモフィドルです

于 2013-03-11T19:05:16.893 に答える