在jQuery 1.4.2中添加一个简单的确认/取消对话框

Adding a simple confirm/cancel dialog in jQuery 1.4.2

本文关键字：简单 一个 确认 对话框 取消 jQuery 添加      更新时间：2023-09-26

我在每个列表项中都放了一个可点击的跨度，它运行良好。目前，它调用一个简单的警报。

现在我想添加一个简单的取消/确认对话框。每个选择都应该调用一个函数。

这是我的代码（注意span点击调用的警报）：

<%@ Reference Control="~/KPIP/Controls/MultiUpload.ascx" %>
<%@ Register Src="~/KPIP/Controls/MultiUpload.ascx" TagName="MultiUpload" TagPrefix="tetrada" %>
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Entry.aspx.vb" Inherits="KPIP_Entry" %>

        var barcodes = { <%# BarcodeArray %> }

        kpip.viewAttachment = function (url) {
            $("#entryViewer").attr("src", "../Viewer.aspx?image=" + url);
        }

        function resizeViewer() {
            $("#entryViewer").hide();
            $("#attachments").hide();
            $("#entryViewer").width($("#entryForm").width() - 320 - 4);
            $("#entryViewer").height($("#entryForm").height() - $("#header").height() - 4);
            $("#attachments").height($("#entryForm").height() - $("#header").height() - 4);
            $("#attachments").show();
            $("#entryViewer").show();
        }
        $(function () {
            $.each(barcodes, function(key, value) {
                $("#barcodesList").append("<li>" + key + "</li>");
            });
            deleteButton = $('<span />').addClass('deleteButton').text('Delete');
            $('ul#barcodesList li').append(deleteButton);

            if ($("#barcodesList").children().size() > 0) {
                $("#barcodesList").after('<div id="barcodesShadow" class="cc_panelShadow"></div>');
            }

            $("#barcodesList > li").click(function () {
                $(this).children(".children").toggle();
                $("#barcodesList > li").removeClass("clicked");
                $(this).addClass("clicked");
                $("#selectedBarcode").val($(this).text());
                var params = '{ barcode : "' + $(this).text() + '", path : "' + barcodes[$(this).text()] + '" }';
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "Entry.aspx/Attach",
                    dataType: "json",
                    data: params,
                    success: function () {
                        $("#dummyPostbackButton").click();
                    },
                    error: function (request, status, error) {
                        alert("Error attaching barcode file.");
                    }
                });
            });
            $("#barcodesList > li > span").click(function(e) {
               e.stopPropagation();
               var partxt = $(this).parent().clone().children().remove().end().text();
               alert(partxt);
            });
            $(window).bind("resize", function () {
                setTimeout(function () { resizeViewer(); }, 10);
            });
            setTimeout(function () { resizeViewer(); }, 10);
            $("#barcodesList > li").each(function () {
                if ($(this).text() != $("#selectedBarcode").val()) { return; }
                $(this).addClass("clicked");
            });
        });
    </script>
</head>
<body>
    <form id="entryForm" runat="server">
    <div id="header" class="ContentHeader">
        <asp:Label runat="server" CssClass="ContentHeaderLabel" Text="<%$ Resources: Header.Text %>"/>
    </div>
    <div id="attachments">
        <asp:Label class="tetradaGroupLabel" runat="server" Text="<%$ Resources: AttachmentsPanel.Text %>" />
        <tetrada:MultiUpload ID="upload" runat="server" />
        <asp:Panel ID="BarcodesListPanel" runat="server">
            <asp:Label class="tetradaGroupLabel" runat="server" Text="<%$ Resources: BarcodesPanel.Text %>" />
            <ul id="barcodesList"></ul>
        </asp:Panel>
        <asp:HiddenField ID="selectedBarcode" runat="server" />
        <asp:Button ID="dummyPostbackButton" runat="server" CausesValidation="false" />
    </div>
    <iframe id="entryViewer" frameborder="0" runat="server"></iframe>
    </form>
</body>
</html>

我试着把对话框放在几个地方，然后在点击事件中打开它，但什么也没发生。有人能帮我吗？

致以最良好的问候，9号。

如果bu simple的意思是原生的，请使用confirm而不是alert；

confirm("Your Text")//Return true if user pressed ok
// false otherwise

这样你就可以做一些类似的事情：

if(confirm("Your Text")){
//do stuff
}

如果您想在代码中添加一个确认对话框

看起来像

var choice = confirm("Are you sure?");

并验证用户是否单击yes || no

if(choice == true) { //then do something here }

希望能有所帮助。。

有一个插件：Simple Confirm Dialog（我想还有很多其他类似的插件）。

相关文章：