2

在此处输入图像描述

我正在努力做到这一点，因此当您点击“选择”按钮时，无论蓝色突出显示的 div 结束，它都会发出警报。我该如何做到这一点，所以总是选择蓝色下方的项目？

在图片的情况下，它会提醒“陈旧”，如果它按我理想的方式工作，我试图让它工作

这就是我现在所拥有的，它不会提醒任何东西

$('#selectButton').click( function() {
    alert($('#myAdjSelect option:selected').val());
});

列表的代码如下

<div class="control-group">
          <div class="controls">
            <div style="width:540px;height:16px;border:2px solid blue;position:absolute;margin-top:38px;background-color:rgba(0,0,255,.3)"></div>
            <select multiple="multiple" id="myAdjSelect" class="input-xlarge" style="height:100px">
            </select>
            <select multiple="multiple" id="myNounSelect" class="input-xlarge" style="height:100px">
            </select>

            <button type="button" id="selectButton" name="selectButton" class="btn btn-primary">Select</button>
          </div>
        </div>

我试图让它选择而无需单击，关于如何完成此操作的任何想法？

4

2 回答 2

3

首先改变

alert($('#myAdjSelect option:selected').text());

至

alert($('#myAdjSelect option:selected').val());

如果即使发生了不同的事件，您也想获得该事件，您可以使用.focus()

于 2013-07-08T19:24:11.900 回答
2

您需要暂时隐藏蓝色覆盖 div，并获取 div 下的元素。如果你给覆盖 div 一个类或 id，这会更容易一些。

$('#selectButton').click( function() {

    var overlay = $('#overlayDiv');
    var pos = overlay.position();

    overlay.hide();
    element = document.elementFromPoint( pos.left + 5, pos.top + 5 );
    overlay.show();

    alert($(element).val());

});

我们在位置上添加了一些内容，以确保我们在叠加层内。与其使用边距来定位叠加层，不如使用该top属性。如果您想要第二个选择列表中的元素，请在左侧位置添加一个偏移量并以相同的方式获取该元素。http://jsfiddle.net/bLpgL/

于 2013-07-08T19:47:49.747 回答