0

我有一个包含 3 个选项的下拉菜单。此菜单显示在模式jQuery UI对话框中。

我可以打开对话框并选择三个选项之一。选择的选项存储在一个变量中。这工作正常。但是如果我再次打开对话框并选择另一个选项,变量不会改变 - 它包含第一个选择的值。

$("#button").click(function() 
{   
    var diag = "<select id='diagDropdown'>"
            +"<option>Option 1</option>"
            +"<option>Option 2</option>"
            +"<option>Option 3</option>"
               +"</select>";

    $(diag).dialog(
        {title: "Choose Option"},
        {autoOpen: "false"},
        {modal: "true"},
        {draggable: "false"},
        { buttons: {OK: dialogOK} });       

    function dialogOK() 
    {
        var chosenOption=$("#diagDropdown option:selected").val().toLowerCase();

        //working with chosen option
        $(this).dialog("close");                                                                
    }); 

希望您能够帮助我。提前致谢!

4

1 回答 1

1

问题是,每次您单击 id 为“ button ”的元素时,都会在新对话框中创建一个 id 为“ diagDropdown ”的新下拉菜单。

然后你的代码:

var chosenOption=$("#diagDropdown option:selected").val().toLowerCase();

始终选择 DOM 中 ID 为“ diagDropdown ”的第一个下拉菜单。

试试这个 :

<input type="button" value="click me" id="button"/>

<script type="text/javascript">
    // On DOM ready
    $(function() {

        var dropdown = 
            $('<select id="diagDropdown"> ' +
                '<option>Option 1</option>' +
                '<option>Option 2</option>' +
                 '<option>Option 3</option>' +
             '</select>');

        // Create the dialog (only once)
        dropdown.dialog({
            title: "Choose Option",
            autoOpen: false,
            modal: true,
            draggable: false,
            buttons: {
                "OK": function() {
                    var chosenOption=$('#diagDropdown option:selected').val().toLowerCase();
                    //working with chosen option
                    $(this).dialog('close');
                }
            }
        });

        // Bind click event : on click just open the existing dialog 
            $('#button').click(function() {
                $('#diagDropdown').dialog('open');
            });
    });
</script>
于 2013-03-20T15:07:24.717 回答