Jquery Multiselect - 手动触发事件？

发布于 2024-07-23 05:20:23 字数 961 浏览 4 评论 0原文

我正在使用来自以下位置的 jquery 多选控件： http://abeautifulsite.net/notebook/62

我需要通过 javascript 对特定事件手动检查选项之一。

每当我尝试更改选中的属性，或触发单击，显式调用单击函数等时，我都会选中复选框，但 CSS 永远不会更改，并且文本框永远不会使用当前选定的元素刷新。

例子：如果我想使用 JavaScript 代码选择带有“TRA”值的复选框并确保其行为正常，我该如何实现？

<input class="multiSelect" type="text" style="cursor: default;" value="" readonly="readonly"/>

<div class="multiSelectOptions" style="position: absolute; z-index: 99999; display: none;">
    <label class="selectAll">
        <input class="selectAll" type="checkbox"/>
        (All)   
    </label>
    <label>
        <input type="checkbox" value="ADP" name="Attributes"/>
        Adaptation
    </label>
    <label>
        <input type="checkbox" value="TRA" name="Attributes"/>
        Translation
    </label>
</div>

原文

I'm using the jquery multiselect control from: http://abeautifulsite.net/notebook/62

I need to manually check one of the options via javascript on a specific event.

Whenever I try to change the checked attribute, or trigger a click, call the click function explicitely etc., I the checkbox gets checked but the CSS is never changed and the textbox is never refreshed with the currently selected element(s).

Example:
If I want to select the checkbox with the 'TRA' value with javascript code and make sure it behaves properly, how can I achieve this?

<input class="multiSelect" type="text" style="cursor: default;" value="" readonly="readonly"/>

<div class="multiSelectOptions" style="position: absolute; z-index: 99999; display: none;">
    <label class="selectAll">
        <input class="selectAll" type="checkbox"/>
        (All)   
    </label>
    <label>
        <input type="checkbox" value="ADP" name="Attributes"/>
        Adaptation
    </label>
    <label>
        <input type="checkbox" value="TRA" name="Attributes"/>
        Translation
    </label>
</div>

分享到QQ

分享到微博

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

发布评论

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

仄言 2024-07-30 05:20:23

看来你需要在触发点击事件之前设置checked属性，然后再设置checked属性。我将进一步研究它，但与此同时，这是解决方案

工作示例< /strong>

相关 HTML

<select id="sample" multiple="multiple">
    <option value=""/>
    <option value="ADP">Adaptation</option>
    <option value="TRA">Translation</option>
</select>
<br/>
<input id="check" type="button" value="Check TRA" style="margin-left: 250px; width: 100px;" />
<br/>
<input id="uncheck" type="button" value="Uncheck TRA" style="margin-left: 250px; width: 100px;" />

It seems that you need to set the checked attribute before triggering the click event and then set the checked attribute after too. I'm going to look into it further, but in the meantime, here's the solution

Working Example

relevant jQuery Code

$(function() {
    $('#sample').multiSelect();
    $('#check').click(function() {
        $('input[type="checkbox"][value="TRA"]')
            .attr('checked',true)
            .trigger('click')
            .attr('checked',true);
    });
    $('#uncheck').click(function() {
        $('input[type="checkbox"][value="TRA"]')
            .attr('checked',false)
            .trigger('click')
            .attr('checked',false);
    });
});

relevant HTML

<select id="sample" multiple="multiple">
    <option value=""/>
    <option value="ADP">Adaptation</option>
    <option value="TRA">Translation</option>
</select>
<br/>
<input id="check" type="button" value="Check TRA" style="margin-left: 250px; width: 100px;" />
<br/>
<input id="uncheck" type="button" value="Uncheck TRA" style="margin-left: 250px; width: 100px;" />

回复收藏 0 原文

~没有更多了~