Question

我试图隐藏“FilterBatch”选择输入元素但没有任何反应。窗口打开后，选择的html输入仍会显示。我还尝试从click事件中调用Hide（）。这是示例代码：

 var modalRerunConfirmDialog = $("<div id=\"modalRerunConfirmDialog\"/>").dialog({
    modal: true,
    autoOpen: false,
    title: "UDS Dashboard - Rerun jobs",
    resizable: false,
    draggable: false,
    dialogClass: "dialogOverride",
    buttons: {
        Yes: function () {
            $("#modalRerunConfirmDialog").dialog("close");
            //do something
        },
        No: function () {
            $(this).dialog("close");
        }
    },
    width: 550
});
var msg = Array();
msg[msg.length] = "<br><br><div style=\"font-size:2.0em\">Filter Your Selection</div>";
msg[msg.length] = "<br/><div><select id=\"FilterBatch\" style=\"width:500px;\"></select></div>";
modalRerunConfirmDialog.html(msg.join(" "));

//Bind the Select Box to the Multiselect jQuery plugin
$("#FilterBatch").multiselect({
    noneSelectedText: "Select Batch",
    selectedList: 1,
    multiple: false,
    click: function (event, ui) {
        FilterBatch_Change(ui.value); <= == I also tried to call.Hide() here !! !
    }
});

//populate the first dropdown box inside the modal window
$.each(arrayIDs, function (index, value) {

    $('#FilterBatch').append($('<option>', {
        value: value,
        text: value
    }));
});
$('#FilterBatch').multiselect("refresh");

//hide the select html element <=== this is not working !!!
$("#FilterBatch").hide();

modalRerunConfirmDialog.dialog("open");

谢谢

Answer 1

您可以将open事件添加到对话框中：

$("#modalRerunConfirmDialog").on("dialogopen", function() {
    $("#FilterBatch").hide();
});

或者您可以稍微优化您的代码，例如：

var msg = "<br><br><div style=\"font-size:2.0em\">Filter Your Selection</div> " +
            "<br/><div><select id=\"FilterBatch\" style=\"width:500px;\"></select></div>"; 

 var modalRerunConfirmDialog = $("<div>", {
    id: "modalRerunConfirmDialog",
    html: msg
}).dialog({
    modal: true,
    autoOpen: false,
    title: "UDS Dashboard - Rerun jobs",
    resizable: false,
    draggable: false,
    dialogClass: "dialogOverride",
    buttons: {
        Yes: function () {
            $("#modalRerunConfirmDialog").dialog("close");
            //do something
        },
        No: function () {
            $(this).dialog("close");
        }
    },
    width: 550,
    open: function(){
        $("#FilterBatch").hide();
    }
});

Answer 2

最酷的方法是使用 Knockout.js

http://learn.knockoutjs.com/#/?tutorial=webmail

但你可以用jQuery做到这一点!!!

<强> JS

$("#idToShowOrHide").addClass('hide-me');

或

$("#idToShowOrHide").removeClass('hide-me');

<强> CSS：

.hide-me{ display:none;}

.iAmOnTop
 { 
    z-index:9999;
    position:fixed;
    margin-left:50%
    margin-top:30%
 }

jQuery / modal对话框：如何在显示窗口时隐藏选择元素？

2 个答案: