Question

我一直在努力工作几个小时，我无法使用以下代码;

<li>
<img width="100px" height="100px" src="$profile_picture">
<p>Username: $username</p>
<p>UserID: $userid</p>
<p>Bio: $bio</p>
<p>Website: $website</p>
<input type="button" value="Block" data-role="button" id="myButton"/>
</li>
<li data-role="list-divider"></li>

我想将按钮的值更改为“已屏蔽”，这是我的javascript：

<script type="text/javascript">
$("input[type='button']").toggle(function () {
    $(this).val("Block");
}, function () {
    $(this).val("Blocked");
});
</script>

我正在使用以下版本的jquery和jqm：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

知道为什么这不能正常工作？非常感谢所有帮助...... TKS！

Answer 1

使用这种方式的toggle()函数在jQuery 1.8中已弃用，在1.9中已删除

$("#myButton").on('click', function(){
    $(this).val(function(i,val) {
        return val=='Block' ? 'Blocked' : 'Block';
    });
});

你应该在移动之前加载jQuery：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

记住文档就绪功能，或在底部添加代码。

Answer 2

您正在使用的toggle函数已在jQuery版本1.9中删除（不推荐使用的版本：1.8，已删除：1.9）

http://api.jquery.com/toggle-event/

您可以通过在click处理程序上实现此功能并切换值来实现相同目的。

为什么要将其删除？ [版本1.9]

http://jquery.com/upgrade-guide/1.9/#toggle-function-function-removed

这是“点击运行指定函数的元素”签名.toggle()。不应该将.toggle()的“更改元素的可见性”与未弃用的内容混淆。前者被删除以减少混淆并提高库中模块化的可能性。 jQuery Migrate插件可用于恢复功能。

为何弃用？ [版本1.8]

http://bugs.jquery.com/ticket/11786

你知道我们有两个.toggles吗？我们喜欢的那个在适当时执行.show或.hide，并记录在http://api.jquery.com/toggle/。另一个设置了循环.click处理程序，并记录在http://api.jquery.com/toggle-event/：

提供.toggle（）方法是为了方便起见。手动实现相同的行为是相对简单的，如果.toggle（）中内置的假设证明是有限的，这可能是必要的。例如，如果对同一元素应用两次，则无法保证.toggle（）无法正常工作。由于.toggle（）在内部使用单击处理程序来完成其工作，因此我们必须解除绑定以删除与.toggle（）附加的行为，以便可以在交火中捕获其他单击处理程序。该实现还在事件上调用.preventDefault（），因此如果在元素上调用了.toggle（），则不会遵循链接并且不会单击按钮。

让我们摆脱痛苦。

Answer 3

除了小伙子们说的话，你可以用稍微不同的方式使用另一种切换

 <input type="button" value="Block" data-role="button" class="myButton"/>
 <input type="button" value="Blocked" data-role="button" class="myButton" style="display:none;"/>

和

$(".myButton").on('click', function (){
    $('.myButton').toggle()
});

Jquery更改按钮值不起作用

3 个答案: