单击按钮调用JavaScript函数后面的代码 - C＃

Question

我有一个Js函数调用bootstrap模式弹出窗口。 我在按钮点击后从代码后面调用这个Js函数。 问题是，当我点击按钮时，它显示模态弹出窗口，但是当我导航到另一个页面时（当我点击另一个按钮时，它导航到谷歌文档阅读器）并返回到主页，它再次出现没有任何按钮点击加载弹出窗口。 谁能帮我这个。

JS功能

<head>
 <script type="text/javascript">
            function showModal() {
                $('#viewOc').modal();
            };
    </script>
</head>

模态弹出代码

 <div class="modal fade" id="viewOc" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4>TRIAL</h4>
                </div>
                <div class="modal-body">
                    LOREM IPSUM
                </div>
                <div class="modal-footer">
                    <a class="btn btn-primary" data-dismiss="modal">
                        Close
                    </a>
                </div>
            </div>
        </div>
    </div>

代码背后

 protected void LinkButton1_Click(object sender, CommandEventArgs e)
            {
                //some operations here
                string script = "window.onload = function() { showModal(); };";
                ClientScript.RegisterStartupScript(this.GetType(), "modalShow", script, true); 
            }

Html代码

<asp:LinkButton ID="LinkButton1" runat="server" Text="Click Here" CausesValidation="false" commandArgument='<%#Eval("value")%>' OnCommand="LinkButton1_Click"/>

Google文档按钮点击事件

 protected void btnView_View(object sender, CommandEventArgs e)
        {
            //not sure if the below code is correct or wrong. But as of now im using this in my application. Didnt try it on server yet.
            string path = e.CommandArgument.ToString();
            Response.Redirect("http://docs.google.com/viewer?url=" + Server.UrlEncode(path),true);
        }

页面加载

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                IndexDocuments();

            }
        }

PS：我知道类似的问题，但在SO中提出了不同的问题。 由于我没有足够的声誉来评论这个问题，我不得不发一个新帖子。

Answer 1

你应该点击按钮调用模型

$('buttonID').click(function(){ $('modalID').modal('show'); });

你正在调用window.onload上的模态，这就是为什么它在页面加载时弹出的原因。

Answer 2

Vishal在下面提到了一种更好的处理方法。

$（'buttonID'）。click（function（）{$（'modalID'）。modal（'show'）;}）;

您可以使用带有上述代码的普通HTML按钮，而不是使用ASP按钮。

谢谢，Souvik

Answer 3

每次加载窗口时都绑定showModal（）。 像这样更改代码隐藏：

protected void LinkButton1_Click(object sender, CommandEventArgs e)
        {
            //some operations here
            ScriptManager.RegisterStartupScript(this, this.GetType(), "modalShow", "showModal()", true); 
        }

Answer 4

添加js和css引用

<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> </script>

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<script type="text/javascript">
        function showModal() {
            $('#viewOc').modal();
        };
</script>

</head>

使用此代码：

protected void LinkButton1_Click(object sender, CommandEventArgs e)
{
    //some operations here
    if(!ClientScript.IsStartupScriptRegistered("JSScript"))
    {
      ClientScript.RegisterStartupScript(this.GetType(),"JSScript",
      @"<script type='text/javascript'>showModal()</script>");
    } 
}

单击按钮调用JavaScript函数后面的代码 - C＃

问题描述

JS功能

模态弹出代码

代码背后

Html代码

Google文档按钮点击事件

页面加载

4 个解决方案

解决方案1
0 2016-05-18 06:35:04

解决方案2
0 2016-05-18 06:35:33

解决方案3
0 2016-05-18 06:40:10

解决方案4
0 2016-05-18 07:14:41

单击按钮调用JavaScript函数后面的代码 - C＃

问题描述

JS功能

模态弹出代码

代码背后

Html代码

Google文档按钮点击事件

页面加载

4 个解决方案

解决方案1 0 2016-05-18 06:35:04

解决方案2 0 2016-05-18 06:35:33

解决方案3 0 2016-05-18 06:40:10

解决方案4 0 2016-05-18 07:14:41

解决方案1
0 2016-05-18 06:35:04

解决方案2
0 2016-05-18 06:35:33

解决方案3
0 2016-05-18 06:40:10

解决方案4
0 2016-05-18 07:14:41