jqueryui按钮状态不会改变道具调用 [英] jqueryui button state not changing on prop call

查看:64
本文介绍了jqueryui按钮状态不会改变道具调用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用简单的道具调用来更改 jqueryui 切换按钮的状态(又名复选框 )使用这个:
$(#completed_button)。prop(checked,true);

I am using a simple prop call to change the state of a jqueryui "toggle" button (aka checkbox) using this: $("#completed_button").prop("checked", true);

功能上,复选框正在改变状态,脚本正常运行。不幸的是,它没有改变按钮的视觉状态。知道为什么它不能以及我能做些什么才能做到这一点?

Functionally the checkbox is changing state and the script is operating properly. Unfortunately it is not changing the visual state of the button. Any idea why its not and what I can do to make it so?

示例:当你使用鼠标切换时,中间是下面的样子,右边是当我使用上述电话时​​会发生什么。注意文本是如何正确的,但视觉突出显示不是。

Example: Below the middle is what it looks like when you use the mouse to toggle, right is what happens when i use the above call. Notice how the text is correct, but the visual highlight is not.

推荐答案

问题是按钮的jQuery-UI元素正在侦听更改来自切换按钮的事件,但当您说 .prop('checked',true)时,更改事件不会触发。这种行为一直回到 DOM Level 2事件模型

The problem is that the jQuery-UI elements for the button are listening for change events from the toggle button but the change event doesn't fire when you say .prop('checked', true). This behavior goes all the way back to the DOM Level 2 Event Model:


当控件丢失输入焦点并且其值已被修改后,就会发生更改事件获得关注。此事件对INPUT,SELECT和TEXTAREA有效。元素。

The change event occurs when a control loses the input focus and its value has been modified since gaining focus. This event is valid for INPUT, SELECT, and TEXTAREA. element.

调用 .prop('checked',true)(或甚至 .attr('checked','checked'))不会改变焦点,因此不会发生更改事件。

Calling .prop('checked', true) (or even .attr('checked', 'checked')) doesn't alter the focus so no change event occurs.

解决方案是自己触发更改事件:

The solution is to trigger the change event yourself:

$("#completed_button").prop("checked", true).change();

这应该让jQuery-UI包装器知道复选框已更改状态,然后是jQuery-UI视觉也会改变。

That should let the jQuery-UI wrapper know that the checkbox has changed state and then the jQuery-UI visual will also change.

这是一个快速演示,说明了发生了什么: http://jsfiddle.net/ambiguous/8et3G/

Here's a quick demo that illustrates what's going on: http://jsfiddle.net/ambiguous/8et3G/

这篇关于jqueryui按钮状态不会改变道具调用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆