2

我有一个 html 模板，可以修改 html 选择框的外观。

 <select id='floorinput' class='select multiple-as-single easy-multiple-selection check-list allow-empty' multiple style="width:100px"></select>

该模板使用类来美化选择框。选择框的选项由 ajax 调用的结果填充，并且工作正常。选择框最终在浏览器上呈现如下：

<span class="select multiple-as-single easy-multiple-selection check-list allow-empty replacement" style="width: 97px; " tabindex="0">
    <span class="select-value alt">All</span>
    <span class="select-arrow"></span>
    <span class="drop-down custom-scroll" style="">
    <span class="selected"><span class="check"></span>Floor-1</span>
    <span class="selected"><span class="check"></span>Floor-2</span>
    .....
    <div class="custom-vscrollbar" style="display: none; ">
       <div></div>
    </div></span>
    <select id="floorinput" class="" multiple="" style="width: 100px; display: none; " tabindex="-1">
       <option value="Floor-1" selected="selected">Floor-1</option>
       <option value="Floor-2" selected="selected">Floor-2</option>
    </select>
</span>

该模板通过隐藏实际的选择框并呈现一个花哨的选择框来工作。

我想模拟鼠标点击这个选择框。目的是取消选择已经选择的选项。模板代码无法处理对#floorInput 选项的编程点击（实际的 html 输入）。所以我决定点击像这样的跨度：

var j = 0;
//DEselect selected floors programtically
$("#floorinput option").each(function () {
    if ($(this).attr("selected") == "selected") {
        console.log('should deselect this:' + $(this).text());
        $('.select-value.alt').click();//simulate click to open dropdown
        $('.drop-down.custom-scroll span.check')[j].click();//perform click. ERROR here
    }
    else {
        console.log('already selected :' + $(this).text());
    }
    j++;
});

我在 Windows 7 上使用 chrome 版本 22.0.1229.94 m。代码引发如下错误：

Uncaught TypeError: Cannot call method 'click' of undefined

但是当我通过 Chrome 的控制台调用相同的方法时，它会按预期工作：

$('.select-value.alt').click();
$('.drop-down.custom-scroll span.check')[0].click();//select or deselect first option

问题的可能原因可能是在调用 $('.select-value.alt').click(); 后选择框的标记不可用。但是我尝试通过几种方法延迟第二个方法调用，但它不起作用。

jquery方法通过控制台工作但在实际执行期间没有工作的任何场景？请帮忙。PS：垃圾邮件预防不允许我上传屏幕截图:(。

4

0 回答 0