làm thế nào để hiển thị cảnh báo xác nhận với ba nút 'Yes' 'Không' và 'Hủy' vì nó cho thấy trong MS Word

Tôi thấy một hộp cảnh báo xác nhận thông qua JavaScript:làm thế nào để hiển thị cảnh báo xác nhận với ba nút 'Yes' 'Không' và 'Hủy' vì nó cho thấy trong MS Word

function checked() { 
if (hdnval.toLowerCase() != textbox1.toLowerCase()) { 
    var save = window.confirm('valid') 
    if (save == true) 
    { 
    return true; 
    } 
    else 
    { 
     return false; 
    } 
} 
}

Cảnh báo xác nhận đang hiển thị với hai nút: OK và Cancel.

Tôi muốn hiển thị nút thứ ba trong thông báo xác nhận của mình. Tôi muốn ba nút như thế này: 'Có' 'Không' 'Hủy bỏ' ', như nó hiển thị trong MS Word.

Nguồn

2012-02-01 Rocky

Chắc chắn bạn không có nhiều tùy chọn ở đây. Ngoài ra, 'Không' sẽ khác với 'Hủy' như thế nào? –

@BrianDriscoll: OP có thể muốn xác định logic tùy chỉnh cho "Không." Ví dụ: người dùng nhấp vào "Đóng": hộp thoại cho biết "Bạn có muốn lưu công việc của mình trước khi rời đi không?" Có: lưu và đóng, Không: đóng mà không lưu, Hủy: để công việc mở. – StriplingWarrior

@Brian Driscoll: StriplingWarrior là đúng, Có nghĩa là Lưu, Không có nghĩa là không lưu và đi đến tab khác, hủy bỏ có nghĩa là không lưu nhưng ở lại trong cùng một trang – Rocky

Điều này không thể được thực hiện với hộp thoại javascript gốc, nhưng rất nhiều thư viện javascript bao gồm các hộp thoại linh hoạt hơn. Bạn có thể sử dụng một cái gì đó như hộp jQuery UI's dialog cho việc này.

Xem thêm những câu hỏi này rất giống nhau:

Dưới đây là một ví dụ, như thể hiện trong this jsFiddle:

<html><head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script> 
    <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css"> 
</head> 
<body> 
    <a class="checked" href="http://www.google.com">Click here</a> 
    <script type="text/javascript"> 

     $(function() { 
      $('.checked').click(function(e) { 
       e.preventDefault(); 
       var dialog = $('<p>Are you sure?</p>').dialog({ 
        buttons: { 
         "Yes": function() {alert('you chose yes');}, 
         "No": function() {alert('you chose no');}, 
         "Cancel": function() { 
          alert('you chose cancel'); 
          dialog.dialog('close'); 
         } 
        } 
       }); 
      }); 
     }); 

    </script> 
</body><html>

Nguồn

2012-02-01 05:05:56 StriplingWarrior

I không có kiến thức trong jquery bạn sẽ vui lòng cho một số bản demo hơn expl. cho thấy rằng tôi có thể sử dụng jquery và có thể thay thế mã của tôi .. Vui lòng – Rocky

@Rocky: Nếu tôi tìm thấy thời gian, tôi có thể cung cấp mẫu mã, nhưng tài liệu cho cả jQuery và hộp thoại jQuery UI khá rõ ràng. Kiểm tra mã nguồn cho trang demo mà tôi đã liên kết tới. Sử dụng Google để tìm hướng dẫn. Tôi thích giúp đỡ khi một vài phút làm việc trên một phần của tôi sẽ giúp bạn tiết kiệm nhiều giờ nỗ lực, nhưng tôi sẽ không làm tất cả công việc cho bạn. – StriplingWarrior

@ StriplingWarrior: cung cấp một chút để được giúp đỡ và mã mẫu sẽ đủ cho tôi, nghỉ ngơi tất cả những gì tôi có thể làm nếu tôi có ý tưởng nào đó và cảm ơn bạn rất nhiều vì đã trả lời và ans. – Rocky

Nếu bạn không muốn sử dụng một thư viện JS riêng biệt ry để tạo điều khiển tùy chỉnh cho điều đó, bạn có thể sử dụng hai hộp thoại confirm để thực hiện kiểm tra:

if (confirm("Are you sure you want to quit?")) { 
    if (confirm("Save your work before leaving?")) { 
     // code here for save then leave (Yes) 
    } else { 
     //code here for no save but leave (No) 
    } 
} else { 
    //code here for don't leave (Cancel) 
}

Nguồn

2012-02-01 05:55:35

Tôi muốn hiển thị tất cả ba nút cùng một lúc – Rocky

làm thế nào để hiển thị cảnh báo xác nhận với ba nút 'Yes' 'Không' và 'Hủy' vì nó cho thấy trong MS Word

Trả lời

Các vấn đề liên quan