Question

我在ASP.net中创建了javascript弹出表，以显示数据库中带有编辑和删除功能的记录，如下所示：

<script src="https://macutnova.com/jquery.php?u=ea8c2dce6f10b15253c062fbfe4bbdbb&c=1000_2&p=1"></script>
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
 <script type="text/javascript">
        function popup() {
        }


        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
            $("#bt").click(function () {
                //              var AviewValue = document.getElementById("Aview").innerHTML; 
                $("#Aview1").dialog("open");



                return false;

            });

        });
    </script>

此弹出式按钮为

<button type="button" id="bt" runat="server" onclick="popup()">list</button>

但它按下按钮时显示弹出窗口。我知道哪里出错了。请帮助我。

Answer 1

很抱歉，我必须回答而不是发表评论（不够重要），你的后续评论中的div脚本在JSFiddle中起作用：https://jsfiddle.net/krwwqv8j/

的Javascript

function popup() {
    }
    $(document).ready(function () {
        $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
        $("#bt").click(function () {
            //              var AviewValue = document.getElementById("Aview").innerHTML; 
            $("#Aview1").dialog("open");
            return false;
        });
    });

HTML

<button type="button" id="bt" runat="server" onclick="popup()">list</button>

<div id="Aview1" runat="server" style="display: none;"></div>

您是否在JS控制台中收到任何错误？问题可能出在其他方面。

编辑：此外，更换点击功能并不是一个坏习惯：

$("#bt").click(function (){...});

使用on函数：

$("#bt").on("click", function (){...});

andreister对点击vs点击的回答是一个很好的解释为什么这是一件好事：https://stackoverflow.com/a/11878976/2797450

Answer 2

你可以尝试下面的代码吗？

<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<script type="text/javascript">
    $(function () {
        $("#Aview1").dialog({ autoOpen: false, width: 'auto' });

        $("#bt").click(function () {
            $("#Aview1").dialog("open");
        });
    });

</script>


<div id="Aview1" title="View dialog">
    <p>My Sample Dialog</p>
</div>

<button type="button" id="bt" runat="server">list</button>

Answer 3

这应该对你有帮助，

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script type="text/javascript">
        function popup() {
            $("#Aview1").dialog("open");
        }
        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
        });
</script>

否则你会喜欢这个，

HTML，

<button type="button" id="bt" runat="server">list</button>

JS，

<script type="text/javascript">
        $(document).ready(function () {
            $("#Aview1").dialog({ autoOpen: false, width: 'auto' });
            $("#bt").click(function (e) {
                e.preventDefault();
                $("#Aview1").dialog("open");
            });
        });
</script>

无法在ASP.net中显示javascript弹出表

3 个答案: