jQuery onclick 切换函数

Question

我有以下 Foundation 切换元素：

<div class="switch radius">
  <input id="x" name="switch-x" type="radio" onclick="$(this).revealProfile('no');"checked>
  <label for="x">No</label>

  <input id="x1" name="switch-x" type="radio" onclick="$(this).revealProfile('yes');">
  <label for="x1">Yes</label>
  <span></span>
</div>

单击时我想将隐藏字段的输入布尔值从 true 更改为 false：

<input id="real_property_sale_reveal_owner_profile" name="real_property_sale[reveal_owner_profile]" type="hidden" value="false">

我编写了以下函数来实现此目的：

$.fn.revealProfile = function(no) {
    $('input#real_property_sale_reveal_owner_profile').val('false');
};
$.fn.revealProfile = function(yes) {
    $('input#real_property_sale_reveal_owner_profile').val('true');
};

但是，只有最后一个函数在单击切换时运行：$.fn.revealProfile = function(yes) 而不是在两者之间交替。我哪里错了？

Answer 1

改变

$.fn.revealProfile = function(no) {
    $('input#real_property_sale_reveal_owner_profile').val('false');
};
$.fn.revealProfile = function(yes) {
    $('input#real_property_sale_reveal_owner_profile').val('true');
};

到

$.fn.revealProfile = function(boolYesNo) {
    var valueToSet = false;
    if(boolYesNo == 'yes'){
        valueToSet = true;
    }
    $('input#real_property_sale_reveal_owner_profile').val(valueToSet);
};

最后一个函数只有运行的原因是因为您为 prototype 在同一个属性 revealProfile 上定义了它们，所以它是运行您设置的最新功能。最好通过传递参数来像上面那样处理。

Answer 2

您所做的是定义了 2 个同名函数，因此使用了最后一个。你可以试试这个。

$.fn.revealProfile = function(inputVal) {
    var booleanResult = false;
    if (inputVal === 'yes') {
        booleanResult = true;
    }
    $('input#real_property_sale_reveal_owner_profile').val(booleanResult);
};

Answer 3

我想你只漏了一个 space:

<input id="x" name="switch-x" type="radio" onclick="$(this).revealProfile('no');"checked>

应该是

<input id="x" name="switch-x" type="radio" onclick="$(this).revealProfile('no');" checked>

jQuery onclick 切换函数

jQuery onclick toggle function

html

jquery

zurb-foundation