2008-12-02 43 views
33

Tôi đang tạo liên kết xóa đơn giản với sự kiện onClick hiển thị hộp thoại xác nhận. Tôi muốn xác nhận rằng người dùng muốn xóa một mục nhập. Tuy nhiên, có vẻ như khi Hủy được nhấp trong hộp thoại, hành động mặc định (tức là liên kết href) vẫn đang diễn ra, vì vậy mục nhập vẫn bị xóa. Không chắc tôi đang làm gì sai ở đây ... Bất kỳ đầu vào nào cũng sẽ được đánh giá cao.Vấn đề JavaScript đơn giản: onClick xác nhận không ngăn chặn hành động mặc định

EDIT: Trên thực tế, cách mã hiện tại, trang thậm chí không thực hiện cuộc gọi chức năng ... vì vậy, hoàn toàn không có hộp thoại nào xuất hiện. Tôi đã có mã onClick dưới dạng:

onClick="confirm('Delete entry?')" 

đã xuất hiện hộp thoại nhưng vẫn liên kết đến Hủy.

<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt"%> 
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt_rt"%> 
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %> 

<script type="text/javascript"> 

function delete() { 
    return confirm('Delete entry?') 
} 

</script> 


... 

<tr> 
<c:if test="${userIDRO}"> 
    <td> 
     <a href="showSkill.htm?row=<c:out value="${skill.employeeSkillId}"/>" /> 
     <img src="images/edit.GIF" ALT="Edit this skill." border="1"/></a> 
    </td> 
    <td> 
     <a href="showSkill.htm?row=<c:out value="${skill.employeeSkillId}&remove=1"/>" onClick="return delete()"/> 
     <img src="images/remove.GIF" ALT="Remove this skill." border="1"/></a> 
    </td> 
</c:if> 
</tr> 

Trả lời

96

có lỗi chính tả trong mã của bạn (thẻ một bị đóng quá sớm). Bạn có thể sử dụng:

<a href="whatever" onclick="return confirm('are you sure?')"><img ...></a> 

lưu ý các trở lại (xác nhận): giá trị trả về bởi script trong CHẴN nội tại quyết định liệu các hành động trình duyệt mặc định được chạy hay không; trong trường hợp bạn cần phải chạy một mảnh lớn của mã bạn tất nhiên có thể gọi chức năng khác:

<script type="text/javascript"> 
function confirm_delete() { 
    return confirm('are you sure?'); 
} 
</script> 
... 
<a href="whatever" onclick="return confirm_delete()"><img ...></a> 

(lưu ý rằng xóa là một từ khóa)

Đối với đầy đủ: các trình duyệt hiện đại cũng hỗ trợ các sự kiện DOM, cho phép bạn đăng ký nhiều hơn một trình xử lý cho cùng một sự kiện trên mỗi đối tượng, truy cập vào các chi tiết của sự kiện, dừng quá trình truyền và nhiều hơn nữa; xem DOM Events.

+0

Cảm ơn, đã không nhận thấy lỗi đánh máy. – kafuchau

+1

'onClick =" return confirm ('Bạn có chắc chắn muốn xóa?') "' –

10

tôi sử dụng này, hoạt động như một nét duyên dáng. Không cần phải có bất cứ chức năng, chỉ inline với liên kết của bạn (s)

onclick="javascript:return confirm('Are you sure you want to delete this comment?')" 
+1

Cũng không cần sử dụng "javascript:". Nhưng như siukurnin nói, bạn nên sử dụng POST nếu bạn thay đổi một cái gì đó. – some

4

Trước hết, xóa là một reserved word trong javascript, tôi ngạc nhiên này thậm chí thực hiện cho bạn (Khi tôi thử nghiệm nó trong Firefox, tôi gặp lỗi cú pháp)

Thứ hai, HTML của bạn có vẻ kỳ lạ - có lý do nào bạn đóng các thẻ neo mở bằng /> thay vì chỉ >?

+0

Wow, rắm não. Không nghĩ rằng hãy kiểm tra 'xóa' làm từ khóa. Loại "duh" khi có nhiều ngôn ngữ khác được đặt trước. : P – kafuchau

+0

XHTML sử dụng /> để đóng các thẻ trống ... Điều đó có nghĩa là trong mã từ bài đăng gốc, các thẻ a được đóng hai lần !! – some

7

Sử dụng liên kết đơn giản cho một hành động như xóa bản ghi có vẻ nguy hiểm đối với tôi: điều gì xảy ra nếu trình thu thập thông tin đang cố lập chỉ mục các trang của bạn? Nó sẽ bỏ qua bất kỳ javascript và làm theo mọi liên kết, có lẽ không phải là một điều tốt.

Bạn nên sử dụng biểu mẫu có phương thức = "POST".

Và sau đó bạn sẽ có một sự kiện "onsubmit" để thực hiện chính xác những gì bạn muốn ...

+4

Đây là một điểm tuyệt vời. Nó không chỉ nguy hiểm đối với ứng dụng của bạn, nó thực sự là một sự vi phạm thông số HTTP. –

+1

JW. Trình thu thập thông tin có thể truy cập hồ sơ mà không thể đăng nhập được không? – kafuchau

+0

Không, trình thu thập thông tin sẽ không thể truy cập các phần được bảo vệ của trang web của bạn. – Benry

19

Vâng, tôi đã từng có cùng một vấn đề và vấn đề đã được giải quyết bằng cách thêm chữ "trở" trước khi xác nhận:

onclick="return confirm('Delete entry?')" 

Tôi muốn này có thể là heplful cho bạn ..

Chúc may mắn!

6

tôi đã phát hành như nhau (bấm vào nút, nhưng sau khi hủy nhấp vào nó vẫn loại bỏ đối tượng của tôi), vì vậy làm này theo cách như vậy, hy vọng nó sẽ giúp ai đó trong tương lai:

$('.deleteObject').click(function() { 
    var url = this.href; 
    var confirmText = "Are you sure you want to delete this object?"; 
    if(confirm(confirmText)) { 
     $.ajax({ 
      type:"POST", 
      url:url, 
      success:function() { 
      // Here goes something... 
      }, 
     }); 
    } 
    return false; 
}); 
0

thử điều này:

OnClientClick = 'return (xác nhận ("Bạn có chắc chắn muốn xóa nhận xét này không?"));'

4
<img src="images/delete.png" onclick="return confirm_delete('Are you sure?')"> 



<script type="text/javascript"> 
function confirm_delete(question) { 

    if(confirm(question)){ 

    alert("Action to delete"); 

    }else{ 
    return false; 
    } 

} 
</script> 
1

Nếu bạn muốn sử dụng các lệnh nội tuyến nhỏ trong thẻ onclick, bạn có thể sử dụng một cái gì đó như thế này.

<button id="" class="delete" onclick="javascript:if(confirm('Are you sure you want to delete this entry?')){jQuery(this).parent().remove(); return false;}" type="button"> Delete </button>

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