0

ユーザーが入力するフォームが含まれているため、ポップアップ div 内でクリックした場合、ポップアップ div を開いたままにしたい..これは私のコードです

Javascript:

<script>
$('#btnFieldWorkers').bind("click", ToggleDisplay);
function ToggleDisplay() {
    if ($("#div_fieldWorkers").data('shown')) {
       hide();
    }
    else
       display();
 }

    function display() {
        if ($("#div_fieldWorkers").children().length > 0) {
            $("#div_fieldWorkers").fadeIn(300, function () {
                $(document).bind("click", function () { hide(); });
                $("#div_fieldWorkers").data('shown', true)
            });
        }
    }

    function hide() {
        $("#div_fieldWorkers").fadeOut(300, function () {
            $(document).unbind("click");
            $("#div_fieldWorkers").data('shown', false);
        });

    }
</script>

HTML:

<input type="button" value="Add Field Worker" id="btnFieldWorkers" onclick="return ToggleDisplay();" class="btn btn-primary" />
<div id="div_fieldWorkers" style="display:none;" class="form_size"></div>
4

4 に答える 4

0

コードビハインドから、次のようにできます

 ClientScript.RegisterStartupScript(this.GetType(), "Popup", "display();", true);
于 2014-04-08T10:10:30.087 に答える
0

ワーキングデモ

これを試して

     $('#btnFieldWorkers').bind("click", ToggleDisplay);

function ToggleDisplay(e) {
    e.stopPropagation();
    if ($("#div_fieldWorkers").data('shown')) {
        hide();
    } else display();
}

function display() {
    if ($("#div_fieldWorkers").children().length > 0) {
        $("#div_fieldWorkers").fadeIn(300, function () {
            $("#div_fieldWorkers").data('shown', true)
        });
    }
}

function hide() {
    $("#div_fieldWorkers").fadeOut(300, function () {
        $("#div_fieldWorkers").data('shown', false);
    });

}
$('body').on('click', function (e) {
    if ($(e.target).is(' :not(#div_fieldWorkers,#div_fieldWorkers *)')) {
        hide();
    }
});
于 2013-09-30T12:54:01.623 に答える
0

多くの検索とヘルプの後、これが機能していることがわかりました：

   $("html").click(function (e) {

        if (e.target.parentElement.parentElement.parentElement == document.getElementById("div_fieldWorkers") || e.target == document.getElementById("btnFieldWorkers")) { }
        else
        {
            $("#div_fieldWorkers").slideUp("fast");
        }
    });
    function ToggleDisplay() {
        display();
    }

    function display() {

        $("#div_fieldWorkers").slideDown("fast");
    }
于 2013-10-03T05:34:11.300 に答える