始终根据某个位置选择

Question

我试图这样做，当你按下选择按钮时，它总是会警告蓝色突出显示的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>

我试图让它选择而不必点击任何有关如何实现这一点的想法？

Answer 1

首先改变

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

到

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

如果您想要在发生其他事件时获取活动，可以使用.focus()

Answer 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/