2

我正在使用隐藏的锚点来取消引导选择对更改的关注,如下所示:

HTML:

<select id="SelectAddress" name="SelectAddress" class="selectpicker" title="Select an address" data-header="Select an address">
    <option id="1" value="1" selected >First address</option>
    <option id="2" value="2"  >Second address</option>
</select>

jQuery:

$("#SelectAddress").on("change", function() {
//...mycode...
  $("#AFocus").focus();
});

$("#AFocus").focus();会使选择选择器失去焦点,但也会使目标页面上升。AFocus 在页面顶部,所以...

AFocus如何在不滚动页面的情况下不使用像我这样的锚标记来取消选择选择器的焦点?

这是一个示例: http: //jsfiddle.net/ya0o7hzb/向下滚动页面以查看引导选择。

4

2 回答 2

2

bootstrap-select 将在 DOM 中添加一些 HTML,如下所示:

<div class="btn-group bootstrap-select"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" role="button" data-id="SelectAddress" title="Address 1" aria-expanded="false"><span class="filter-option pull-left">Address 1</span>&nbsp;<span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open" role="combobox" style="padding-top: 0px; max-height: 297px; overflow: hidden; min-height: 37px;"><div class="popover-title"><button type="button" class="close" aria-hidden="true">×</button>Select an address</div><ul class="dropdown-menu inner" role="listbox" aria-expanded="false" style="max-height: 248px; overflow-y: auto; min-height: 0px;"><li data-original-index="1" class="selected"><a tabindex="0" class="" data-tokens="null" role="option" aria-disabled="false" aria-selected="true"><span class="text">Address 1</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2" class=""><a tabindex="0" class="" data-tokens="null" role="option" aria-disabled="false" aria-selected="false"><span class="text">Address 2</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div><select id="SelectAddress" name="SelectAddress" class="selectpicker" title="Select an address" data-header="Select an address" onchange="blur_picker('SelectAddress')" tabindex="-98"><option class="bs-title-option" value="">Select an address</option>

因此,您必须blur()使用包含 btn 类的按钮:

$(".btn").blur();

工作示例:http: //jsfiddle.net/93ohvn0j/

于 2017-02-10T14:28:10.467 回答
1

试试这个。这可能会奏效。

<select id="SelectAddress" name="SelectAddress" class="selectpicker" title="Select an address" data-header="Select an address" onChange="blur_picker('SelectAddress')">
<option id="1" value="1" selected >First address</option>
<option id="2" value="2"  >Second address</option>

function  blur_picker ( element ) {
element = document.getElementById(element);
element.blur;
  }

希望这可以帮助!

于 2017-02-10T12:02:51.753 回答