JQuery：切换隐藏字段的值

Question

我一直在搜索如何实现这个功能。在我的表单中，我想通过点击一个div来切换一个值的真假（true <-> false）。

如何使用jquery切换隐藏字段的真/假值？

---

<input id="myHiddenField" name="my[hidden_field]" type="hidden" value="false">

<a id="myDiv">Click Me</a>

我已经尝试过

$('#myDiv').on('click'), (function() {
    var hiddenField = $('#myHiddenField'),
        val = hiddenField.val();

    hiddenField.val(val === "true" ? "false" : "true");
});

但是没有任何输出 :(

jsfiddle: http://jsfiddle.net/MV3A4/2/

- goo

---

请在此处发布支持代码，并展示您尝试过的内容。 - Selvakumar Arumugam

隐藏字段没有布尔值，只有字符串。 - Brad M

https://dev59.com/BHVC5IYBdhLWcg3wlyQo - cfs

Answer 1

这很简单。在您的

上添加一个点击事件处理程序，并使用val()方法更新您的的值。

由于您没有发布您的标记，因此我使用了一些占位符ID。您需要将其更新为在您的上下文中起作用的选择器：

演示

$('#myDiv').on('click', function() {
    var hiddenField = $('#myHiddenField'),
        val = hiddenField.val();

    hiddenField.val(val === "true" ? "false" : "true");
});

请注意，输入值始终为字符串，因此这些值不是真正的布尔值。

- cfs

---

仍然无法让它正常工作。我已经在上面的编辑中包含了一个jsfiddle。 - goo

@Jon 我更新了我的答案，并提供了一个新的演示。这个fiddle有两个问题：第一个是我多了一个(字符，第二个是jQuery没有包含在fiddle中。 - cfs

我应该注意到那些的。谢谢。 - goo

对我来说仍然不起作用，但由于在jsfiddle中正常工作，我认为我的代码中有些问题... 再次感谢。 - goo

@Jon 请仔细检查您的选择器，并确保用 $(function (){...} 包装您的 jQuery 代码。 - cfs

Answer 2

只用JavaScript：

document.getElementById('myClickableDiv').addEventListener('click',function(){
    var value =document.getElementById('myHiddenField').value();
    if(value === "true"){
        document.getElementById('myHiddenField').value = "false";
    }else{
        document.getElementById('myHiddenField').value = "true";
    }
};

- Colin Burr

---

对我没用。我在我的编辑中包含了一个jsfiddle。 - goo

Answer 3

您尝试的jQuery代码存在错误，'click'之前不应该有右括号。

- Colin Burr