DEMO

Question

如何通过jquery onchange选择选项???

打开模型窗口

Modal窗口代码在这里：

<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" id="myModal" style="display:none" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
       Some Contents here..         
    </div>
  </div>
</div>

选择代码选项在此处：

<select id="selectbox">
    <option value="0">- Select -</option>
    <option value="1">yes</option>
    <option value="2">No</option>
</select>

Answer 1

首先，您需要抓住jQuery UI dialog并将其放入(document).ready处理程序中。

$('#dialog-modal').dialog({
    modal: true,
    autoOpen: false
});

之后，您定义一个在.change()上显示的函数，它应该打开对话框：

$('select').change(function () {
    $('#dialog-modal').dialog('open');
});

要说它应该在＆＃39;是＆＃39; 上打开，只需输入一个代表＆＃39;是＆＃39; 选项的if语句：

if ($(this).val() == "1") {
//...code...
}

DEMO

Answer 2

使用Jquery UI和.change。

$(document).ready(function(){
$("#selectbox").change(function(){

   $("#dialog").dialog({
            title: "jQuery Dialog Popup",
            buttons: {
                Close: function () {
                    $(this).dialog('close');
                }
            }
        });
        return false;


});
});

http://plnkr.co/edit/CBKQcuHKH8uMXQVkySC8?p=preview

Answer 3

使用select的change()事件，

$("#selectbox").change(function () {
    if ($(this).val() == "1") {
        var options = {
            "backdrop": "static"
        }
        $("#myModal").modal(options);
    }
});

Answer 4

使用此代码：

$("#selectbox").change(function () {
    if ($(this).val() == "1") {
        $('#myModal).modal('show');
      }
 })

通过jquery onchange选择选项打开模态窗口

4 个答案:

DEMO