12

我很难更改 Zurb 基础中选择框的值。我正在使用自定义表单,它只是隐藏实际的选择框并使用无序列表作为选择框。我的问题是更改选择框值的常用方法不起作用:

$('#selectboxID').val('something')

上面的代码假设选择框中每个选项的值与文本相同:

<option value="1">1</option>

我也试过:

$($('.dropdown ul li')[1]).addClass('current') 

$($('.dropdown ul li')[0]).removeClass('current') //remove current class from the other one

但它也不起作用。

4

4 回答 4

15

There's also alternative use case when you're binding on change event yourself, you might not want to trigger it. Code to just force a refresh on select:

Foundation.libs.forms.refresh_custom_select(@jQueryElement, true)

where @jQueryElement is a original hidden select.

于 2013-05-15T12:31:20.770 回答
8

您必须在更改所选索引后触发“更改”事件。

例子:

// Change selected option
$('#selectboxID').val('something');
// Or use selectedIndex: $("#selectboxID")[0].selectedIndex = 0;

// Fire change event
$('#selectboxID').trigger('change');

希望这可以帮助

于 2012-10-10T02:41:07.870 回答
6

最近在 Foundation 代码中对更改事件的处理方式进行了一些修改。

你仍然可以使用 trigger() 方法实现你想要的,但你必须添加一个“强制刷新”标志:

$('#selectboxID').trigger('change', true);
于 2013-07-22T05:50:40.603 回答
2

如果您使用的是 Foundation 3:

更新到最新的 Foundation 3 版本。

设置selectedIndex,使用 JQueryval()或任何触发change事件的东西都是开箱即用的。

如果您使用的是 Foundation 4:

这似乎是一种回归。作为 -希望是临时的- 解决方法,您可以使用该方法强制更新自定义选择refresh_custom_selection,例如:

Foundation.libs.forms.refresh_custom_selection($('select'))

注意:refresh_custom_selection,不是refresh_custom_select

没有必要使用后者(或trigger('change', true)),因为它们都完全重建了自定义选择,即它们重新复制了您的选择选项,这涉及大量的 DOM 操作,并且会大大减慢速度。(取决于您选择的选项和其他代码的大小)

另一方面refresh_custom_selection,只是更新显示的值,这是一个更轻量级的操作。

PS:代替refresh_custom_selection你也可以使用

$('a.current', $select.next()).text($('option:selected', $select).text());

但是该代码对生成的 HTML 进行了假设,因此最好坚持使用提供实用程序方法

于 2013-10-20T12:57:33.617 回答