Question

我在使用wordpress插件。在管理面板中，我有一个字段集和一个复选框。我想通过选中/取消选中复选框来切换禁用/启用之间的字段集。这是我到目前为止所做的，但它似乎没有用。

HTML

<!-- This is the checkbox -->
<label>
    <input class="checkbox" type="checkbox" onchange="toggleDisable(this);" id="check"/> 
    enable
</label>

<!-- This is the field set -->
<fieldset id="field_set">
    <legend>Field-Set</legend>

    <label for="sel">selectBox</label>
    <select id="sel">
        <option value="posts">Posts</option>
        <option value="terms">Terms</option>
    </select>

    <label for="1">input</label>
    <input type="text" value="text" id="1" />

    <label for="2">input</label>
    <input type="text" value="text" id="2" />

</fieldset>

的JavaScript

function toggleDisable(checkbox) {
    var toggle = document.getElementById("field_set");
    checkbox.checked ? toggle.disabled = false : toggle.disabled = true;
}

事件未被触发，字段集没有任何反应哦，这是一个Fiddle。

Answer 1

试试这个：http://jsfiddle.net/eVqL4/

function toggleDisable(checkbox) {
    var toggle = document.getElementById("field_set");
    $(toggle).prop('disabled', $(checkbox).prop('checked'));
}

Answer 2

Yout代码没问题。问题在于你的小提琴。当您选择onLoad而没有No library时，这意味着您的javascript代码将被放置在window.onload封闭内：

window.onload = function() { /* your code will go here */ }

因此，在这种情况下，您定义的函数将成为本地范围函数，该函数不适用于页面的其余部分。因此，要解决您的问题，您只需选择no wrap (head)即可。见：

http://jsfiddle.net/AY3Ka

通过选中复选框来禁用切换字段集

2 个答案: