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

我正在使用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。

来源

2013-01-23 Yoav Kadosh

你的代码很好，只要确保这个函数在你调用它时可用。 http://jsfiddle.net/AY3Ka/ – dfsq

@dfsq这很有趣...为什么当页面加载时不可用？ –

查看我的解答回答。 – dfsq

YOUT代码是好的。问题在于你的小提琴。当您选择onLoad并没有No library这意味着你的JavaScript代码将被放置window.onload闭包：

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

因此，在这种情况下，你定义的函数变成一个局部范围的函数，而不是适用于页面的其余部分。所以要解决你的问题，你只需要选择no wrap (head)。看到这个：

http://jsfiddle.net/AY3Ka。

来源

2013-01-23 05:57:18 dfsq

这在jsFiddle中有效，但不能在Wordpress中使用。任何想法为什么？在此先感谢，我接受了您的答案。 –

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

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

来源

2013-01-23 05:52:33

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

回答

相关问题