Question

如何在select上添加指向特定选项的链接？我试过了on change，但它没有用。

$('.js-select-manage-edit').on('change', function() {
  alert( 'Hey!' );
});

我的 jsFiddle

Answer 1

您可以使用select元素作为选择器，并检查所选选项是否具有所需类（.js-select-manage-edit）并重定向到外部网址：

$('select.form-control').on('change', function () {
    if ($("option:selected", this).hasClass("js-select-manage-edit")) {
        window.open(this.value);
    }
});

fiddle

Answer 2

如果我了解预期的行为，您希望根据所选的特定选项打开新链接：

$('.form-control').on('change', function() {
    if($(':selected', this).hasClass('js-select-manage-edit'))
        window.open(this.value); // or window.location = this.value; (depending expected behaviour)
});

Answer 3

您的更改事件应绑定到select。然后你可以做这样的事情......

＆＃13;

$('.my-select').on('change', function() {
    if ($(this).find(":selected").attr('value')) {
        window.location = $(this).val(); // won't work in snippet
        alert($(this).val());
    }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="container">
    <div class="row">
        <div class="col-md-6">
            <select class="form-control my-select">
                <option>select</option>
                <option class="js-select-manage-edit" value="http://www.google.com">Item with link</option>
                <option>No link here</option>
            </select>
        </div>
        <div class="col-md-6"></div>
    </div>
</div>

＆＃13;

如何从select中链接特定选项？

3 个答案: