当我们再次选择所选选项时,如何在所选选项上触发事件

时间:2021-12-14 15:05:35
  • when I select option '2' it opens bootstrap - modal.so the first time it opens modal.now option '2' is already selected. now again I click on option '2'. it doesn't fire any change event so, my bootstrap modal doesn't open.because I wrote logic inside change
    event.
  • 当我选择选项'2'时,它会打开bootstrap - modal.so它第一次打开modal.now选项'2'已被选中。现在再次点击选项'2'。它不会触发任何更改事件,因此,我的引导模式不会打开。因为我在更改事件中写了逻辑。

  • so, how can I fire change event on selected option.
  • 那么,如何在所选选项上触发更改事件。

3 个解决方案

#1


3  

Inspite of change event trigger the modal on click event of select option like

尽管更改事件触发选择选项的点击事件模式

$('select option').on('click',function(){
      $("#modelId").modal('show');
});

#2


2  

Create a select with a default value option.

使用默认值选项创建选择。

<select id="slt">
    <option value="default">Select Something</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

Every time, handle the change event for a not defaultValue option, and then reset the default option to selected.

每次都处理非defaultValue选项的更改事件,然后将默认选项重置为selected。

var $slt = $('#slt'),
    defaultValue = 'default';

function handleChange(e){
    var val = $slt.val();

    // do nothing for defaultValue being selected
    if (val === defaultValue) {
        return;
    }

    // do something else
    console.log(val);

    // reset the value to defaultValue
    $slt.find('option:selected').prop('selected', false);
    $lst.find('option').eq(0).prop('selected', true);
}

$slt.bind('change', handleChange);

But this will make the select always show as "Select Something".

但这将使选择始终显示为“选择某事”。

This is a demo about this: http://codepen.io/shuizhongyueming/pen/JWYYLJ

这是一个关于这个的演示:http://codepen.io/shuizhongyueming/pen/JWYYLJ


I found another solution for this, which is better than mine.

我找到了另一个解决方案,这比我的好。

https://*.com/a/12404521/2279763

It use the selectedIndex to reset the selected value on focus, no need for the defaultValue option, and will show the the selected option after click.

它使用selectedIndex重置焦点上的选定值,不需要defaultValue选项,并在单击后显示所选选项。

This is the demo in the comment: http://fiddle.jshell.net/ecmanaut/335XK/

这是评论中的演示:http://fiddle.jshell.net/ecmanaut/335XK/

#3


1  

You can also use modal function

您还可以使用模态功能

$('select option').on('click'function(){
    $('modelId').modal('show');
});

#1


3  

Inspite of change event trigger the modal on click event of select option like

尽管更改事件触发选择选项的点击事件模式

$('select option').on('click',function(){
      $("#modelId").modal('show');
});

#2


2  

Create a select with a default value option.

使用默认值选项创建选择。

<select id="slt">
    <option value="default">Select Something</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

Every time, handle the change event for a not defaultValue option, and then reset the default option to selected.

每次都处理非defaultValue选项的更改事件,然后将默认选项重置为selected。

var $slt = $('#slt'),
    defaultValue = 'default';

function handleChange(e){
    var val = $slt.val();

    // do nothing for defaultValue being selected
    if (val === defaultValue) {
        return;
    }

    // do something else
    console.log(val);

    // reset the value to defaultValue
    $slt.find('option:selected').prop('selected', false);
    $lst.find('option').eq(0).prop('selected', true);
}

$slt.bind('change', handleChange);

But this will make the select always show as "Select Something".

但这将使选择始终显示为“选择某事”。

This is a demo about this: http://codepen.io/shuizhongyueming/pen/JWYYLJ

这是一个关于这个的演示:http://codepen.io/shuizhongyueming/pen/JWYYLJ


I found another solution for this, which is better than mine.

我找到了另一个解决方案,这比我的好。

https://*.com/a/12404521/2279763

It use the selectedIndex to reset the selected value on focus, no need for the defaultValue option, and will show the the selected option after click.

它使用selectedIndex重置焦点上的选定值,不需要defaultValue选项,并在单击后显示所选选项。

This is the demo in the comment: http://fiddle.jshell.net/ecmanaut/335XK/

这是评论中的演示:http://fiddle.jshell.net/ecmanaut/335XK/

#3


1  

You can also use modal function

您还可以使用模态功能

$('select option').on('click'function(){
    $('modelId').modal('show');
});