Cách tiếp cận tốt nhất cho việc vô hiệu hóa (gửi phía máy khách) của nút gửi là gì?

chi tiết:Cách tiếp cận tốt nhất cho việc vô hiệu hóa (gửi phía máy khách) của nút gửi là gì?

Chỉ vô hiệu hóa sau khi người dùng nhấp chuột vào nút gửi, nhưng trước khi đăng tải lại cho máy chủ
ASP.NET Webforms (.NET 1.1)
thích jQuery (nếu có thư viện ở tất cả)
phải được kích hoạt nếu hình thức nạp (tức là thẻ tín dụng thất bại)

Đây không phải là một điều cần thiết mà tôi làm điều này, nhưng nếu có một cách đơn giản để làm điều đó mà không cần phải thay đổi quá nhiều , Tôi sẽ làm nó. (Tức là nếu không có một giải pháp đơn giản, tôi có lẽ sẽ không làm điều đó, vì vậy đừng lo lắng về việc đào quá sâu)

Nguồn

2008-09-05 Macho Matt

Đối với tất cả trình nút, qua JQuery , nó muốn được:

$('input[type=submit]').click(function() { this.disabled = true; });

Hoặc nó có thể có ích hơn để làm như vậy vào mẫu đăng ký:

$('form').submit(function() { 
    $('input[type=submit]', this).attr("disabled","disabled"); 
});

Nhưng tôi nghĩ rằng chúng tôi có thể đưa ra câu trả lời tốt hơn cho câu hỏi của bạn nếu chúng tôi biết nhiều hơn một chút về ngữ cảnh.

Nếu đây là yêu cầu ajax, thì bạn sẽ cần đảm bảo bật lại nút gửi khi thành công hay thất bại.

Nếu đây là biểu mẫu HTTP tiêu chuẩn (ngoài việc tắt nút bằng javascript) và bạn đang thực hiện việc này để bảo vệ an toàn khỏi nhiều lần gửi cùng biểu mẫu, thì bạn nên có một số loại kiểm soát trong mã đề cập đến dữ liệu đã gửi, vì việc vô hiệu hóa nút có javascript có thể không ngăn được nhiều lần gửi.

Nguồn

2008-09-05 16:05:04 SpoonMeiser

trong JQuery:

$('#SubmitButtonID').click(function() { this.disabled = true; });

Nguồn

2008-09-05 15:46:53 Jimmy

Có ba cách để gửi biểu mẫu cần được bao trả. Sử dụng cả hai đề xuất của David McLaughlin và Jimmy. Người ta sẽ vô hiệu hóa phần tử biểu mẫu nút gửi trong khi người kia vô hiệu hóa gửi biểu mẫu HTML cơ bản.

Đối với thứ ba, những điều này sẽ không vô hiệu hóa Javascript khi thực hiện biểu mẫu.submit(). Phương thức OnSubmit="return false" chỉ áp dụng khi người dùng nhấp vào nút gửi hoặc nhấn Enter trong phần tử biểu mẫu nhập. Kịch bản phía máy khách cũng sẽ cần phải được xử lý.

Nguồn

2008-09-05 16:05:08 spoulson

Tôi đoán bạn không muốn họ nhấn nút gửi nhiều lần trong khi quá trình gửi đang được xử lý.

Cách tiếp cận của tôi là chỉ ẩn nút hoàn toàn và hiển thị một số loại chỉ báo trạng thái (gif động, v.v.) thay thế.

Dưới đây là một ví dụ rất giả tạo (đó là về mặt kỹ thuật trong nguyên mẫu nhưng tôi nghĩ một phiên bản jquery sẽ rất tương tự):

<html> 
    <head> 
     <script type="text/javascript" src="include/js/prototype.js"></script> 

     <script type="text/javascript"> 
      function handleSubmit() 
      { 
       $('submit').hide(); 
       $('progressWheel').show(); 
       return true; 
      } 
     </script> 
    </head> 
    <body> 
     <img src="include/images/progress-wheel_lg.gif" id="progressWheel" style="display:none;"/> 
     <input type="submit" name="submit" id="submit" value="Submit" onclick="handleSubmit();"/> 
    </body> 
</html>

Nguồn

2008-09-05 16:08:22

+1 hữu ích khi tôi cần giá trị nút gửi được đăng trong yêu cầu. Vô hiệu hóa nút có nghĩa là giá trị không được đăng. – ajbeaven

Làm thế nào về

Mã đằng sau:

btnContinue3. Thuộc tính.Mục ("onclick") = "disableSubmit()"

Javascript:

function disableSubmit() { 
    document.getElementById('btnContinue3').onclick = function() { 
     alert('Please only click once on the submit button!'); return false; 
    }; 
}

Điều này không giải quyết vấn đề gì xảy ra nếu những lần postback ra, nhưng khác hơn là nó làm việc cho tôi.

Nguồn

2008-10-30 06:40:13

Điều cần lưu ý là bạn không nên vô hiệu hóa nút trước khi gửi biểu mẫu. Nếu bạn tắt nút bằng javascript trong sự kiện OnClick, bạn có thể mất biểu mẫu gửi.

Vì vậy, tôi khuyên bạn nên ẩn nút bằng cách sử dụng javascript bằng cách đặt hình ảnh lên trên hoặc bằng cách di chuyển nút ra khỏi phạm vi hiển thị. Điều đó sẽ cho phép gửi biểu mẫu để tiến hành bình thường.

Nguồn

2008-10-30 07:21:38

Bạn có thể làm một cái gì đó như thế này:

$('form').submit(function() { 
    $(this) 
     .find(":submit,:image")    // get all the submit buttons 
     .attr({ disabled : 'disabled' }) // disable them 
     .end()        // go back to this form 
     .submit(function() {    // change the onsubmit to always reject. 
      return false; 
     }) 
    ; 
});

Lợi ích của việc này:

Nó sẽ làm việc với tất cả các hình thức của bạn, với tất cả các phương pháp nộp:
- nhấp chuột vào một trình phần tử
- nhấn enter hoặc
- gọi form.submit() từ một số mã khác
Nó sẽ vô hiệu hóa tất cả các yếu tố nộp:
- <input type="submit"/>
- <button type="submit"></button>
- <input type="image" />
nó thực sự ngắn.

Nguồn

2008-10-30 07:57:29 nickf

Cách tiếp cận tốt nhất cho việc vô hiệu hóa (gửi phía máy khách) của nút gửi là gì?

Trả lời

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