Question

我正在试图弄清楚如何正确编写jQuery代码，以便我可以从后面的ASP.NET代码中调用它。

我不希望它被jQuery click事件触发，我想触发jQuery函数---＆gt;“在我的控件后面的代码中显示对话框”。

$(document).ready(function () {
    $("#LinkButton1").click(function(){
        $("#hightlight_show1").toggle();
    });

    var dialog1 = $("#Add").dialog({
            autoOpen: false,
            width: 620,
            height: 400
    });

    // Move the dialog back into the <form> element 
    dialog1.parent().appendTo(jQuery("form:first"));

    $("#BT_add").click(function () {
       $("#Add").dialog("open");
       return false;
});

我尝试过这样的事情，但它对我不起作用

$(document).ready(function () {
    $("#LinkButton1").click(function () {
        $("#hightlight_show1").toggle();
    });

    var dialog1 = $("#Add").dialog({
        autoOpen: false,
        width: 620,
        height: 400
    });

    // Move the dialog back into the <form> element 
    dialog1.parent().appendTo(jQuery("form:first"));

    function a() {
        $("#Add").dialog("open");
        return false;
    };

});

我在代码中使用Page.ClientScript.RegisterStartupScript()指定了这一点。

Page.ClientScript.RegisterStartupScript(
    this.GetType(),
    "a",
    "a();",
    true
 );

Answer 1

首先，将function a() {移出$(document).ready()。

但您可能仍然遇到执行顺序问题。

如果这是一个完整的回发，请将a()来自您的RegisterStartupScript与另一个$(document).ready()打包。如果它是来自UpdatePanel的部分回发，只要在第一次加载页面时正确创建了对话框，它就应该有效。

Answer 2

您无法从后面的代码触发JavaScript功能。您可以在html页面上定义JavaScript函数，并使用Control.Attributes.Add绑定服务器端的click事件。你需要服务器控件来绑定事件，你可以通过put runat =“server”来访问html控制服务器

的Javascript

function  YourFun(){
    $("#hightlight_show1").toggle();
}

背后的代码

hightlight_show1.Attributes.Add("onclick", "YourFun();");

Answer 3

似乎服务器端（c＃）操作很难影响客户端（jQuery）事件。您需要使用ajax从服务器请求启动该事件的信息。

请记住，c＃/ ASP代码在Web服务器上运行，它的工作就是根据请求将HTML发送到浏览器。在那之后，它的作用基本上是完整的。 JavaScript和jQuery等由浏览器解释，但只是在文档已经离开服务器之后很久。有一些“方法”你可以让c＃以非常松散的方式触发jQuery事件，但最终你仍然需要认识到客户端（浏览器）和web服务器之间的区别。

Answer 4

您在function a()函数中声明document.ready。

Register.StartupScript会将代码添加到document.onload，您确定哪个事件正在触发（准备好或正在加载）？。

在document.ready之外声明它，它可能会起作用。像这样：

<script type="text/javascript>

function a() {
    $("#Add").dialog("open");
    return false;
};

$(document).ready(function () {
     $("#LinkButton1").click(function(){
         $("#hightlight_show1").toggle();
     });

     // Move the dialog back into the <form> element 
     dialog1.parent().appendTo(jQuery("form:first"));

     var dialog1 = $("#Add").dialog({
         autoOpen: false,
         width: 620,
         height: 400
     });
});

Answer 5

不确定这实际上是否有问题，但在“您尝试过的代码”中，您错过了脚本标记声明中的结束双引号（“）。

您写道：type="text/javascript

但是从未关闭过声明......这肯定会让其他工作人员搞砸了。

Answer 6

这样做

<强>标记

<script type="text/javascript">
    function ShowPopup(message) {
        $(function () {
            $("#dialog").html(message);
            $("#dialog").dialog({
                title: "jQuery Dialog Popup",
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }
                },
                modal: true
            });
        });
    };
</script>
<div id="dialog" style="display: none">
</div>
<asp:Button ID="btnShowPopup" runat="server" Text="Show Popup" OnClick="btnShowPopup_Click" />

代码

  protected void btnShowPopup_Click(object sender, EventArgs e)
{
    string message = "Message from server side";
    ClientScript.RegisterStartupScript(this.GetType(), "Popup", "ShowPopup('" + message + "');", true);
}

在C＃和VB中下载工作演示here

从代码隐藏中触发jQuery函数

6 个答案: