使用 jQuery Mobile 动态更改翻转开关的值

发布于 2024-10-04 06:56:03 字数 255 浏览 4 评论 0原文

我正在使用 jQuery Mobile,并将一些设置保存在 cookie 中。当设置页面重新加载时,我读取 cookie 以设置所有值。我在设置翻转切换开关时遇到问题。大多数元素只需要触发 keyupchanged 事件,但我不确定翻转切换如何从选择框中获取其值。有什么想法吗?

I'm working with jQuery Mobile, and I save some settings in a cookie. When the settings page is reloaded, I read the cookie to set all the values. I'm having trouble setting the flip toggle switch. Most elements just have to trigger the keyup or changed events, but I'm not sure how the flip toggles gets its value from the select box. Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

寄居者 2024-10-11 06:56:03

更改开关的值后,您必须刷新它才能切换动画:

$('#Switch2').val('on').slider("refresh");

After you change the value of the switch you have to refresh it for the animation to toggle:

$('#Switch2').val('on').slider("refresh");
我乃一代侩神 2024-10-11 06:56:03

看起来好像坏了。

转到页面: http://jquerymobile.com/demos/ 1.0a2/#docs/forms/forms-switch.html 并使用 firebug 控制台运行以下命令:

$('#slider2').val('on').trigger('keyup');

它更改开关“on”部分的宽度,但不移动滑块。

所以答案是:等待 JQM 的发布:)

这里发布的 Bug: https: //github.com/jquery/jquery-mobile/issues/issue/676

It looks like it's broken.

Go to the page: http://jquerymobile.com/demos/1.0a2/#docs/forms/forms-switch.html and use firebug console to run the following:

$('#slider2').val('on').trigger('keyup');

it changes the width of "on" part of the switch, but doesn't move the slider.

So the answer is: wait for the release of JQM :)

Bug issued here: https://github.com/jquery/jquery-mobile/issues/issue/676

倒数 2024-10-11 06:56:03

实现此目的的一个简单方法是设置值、触发创建和刷新。
然后,您需要触发 Slidestop 事件来执行绑定到滑块的任何操作。例如:

$('#mySlider').val('on').trigger('create').slider("refresh");
$('#mySlider').trigger('slidestop');

我已经在 jQuery 移动版本上对此进行了测试。 1.3.0

An easy way to achieve this is to set the value, trigger the create and refresh.
Afterwards you need to trigger the slidestop event to perform any action you bound to the slider. eg:

$('#mySlider').val('on').trigger('create').slider("refresh");
$('#mySlider').trigger('slidestop');

I've tested this on jQuery mobile ver. 1.3.0

以酷 2024-10-11 06:56:03

我认为你可以像普通 HTML 一样设置 select 中的值,然后翻转切换开关就会自动选择。 IE

<select name="slider" id="slider" data-role="slider">
  <option value="off">Off</option>
  <option value="on" selected="selected">On</option>
</select>

I think you can just set the value in select like normal HTML and flip toggle switch will pick up automatically. i.e.

<select name="slider" id="slider" data-role="slider">
  <option value="off">Off</option>
  <option value="on" selected="selected">On</option>
</select>
孤凫 2024-10-11 06:56:03

使用 $('#slider2').val('on') 将更改该值,正如预期的那样。但是,它不会将 CSS 类(例如 ui-btn-active)添加到 option 中,也不会从 option 中删除该类>。如果您想动态更改选项,那么您将必须手动处理这些部分(而不是 jQuery Mobile)。

Using $('#slider2').val('on') will change the value, as it is supposed to. However, it does not add the CSS classes such as ui-btn-active to the option, nor does it remove that class from the the option. If you want to dynamically change the option, then you will have to take care of those parts manually (not jQuery Mobile).

征﹌骨岁月お 2024-10-11 06:56:03

这对我有用:

 if (someCondition) {
         $('#slider').val('off');
     }
     else {
         $('#slider').val('on');
     }
     try {
         $('#slider').slider("refresh");
     }
     catch (err) {
         console.log ("Error occurred refreshing slider (probabily first time!)");
     }

This works for me:

 if (someCondition) {
         $('#slider').val('off');
     }
     else {
         $('#slider').val('on');
     }
     try {
         $('#slider').slider("refresh");
     }
     catch (err) {
         console.log ("Error occurred refreshing slider (probabily first time!)");
     }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文