2009-10-13 3 views
12

Tôi có một nút hình ảnh trong một trang có thể được kích hoạt khi nhấp chuột, theo mặc định nó được kích hoạt khi nhấn enter mà tôi muốn tắt.Làm thế nào để vô hiệu hóa hành vi gửi của asp: ImageButton?

Tôi biết về thuộc tính "UseSubmitBehaviour" trong asp: Button, có cách nào để thực hiện tương tự trong asp: ImageButton không?

+0

tôi kiểm tra tài sản của nút UseSubmitBehaviour nhưng nó có vẻ như nó không giải quyết vấn đề của bạn (ví nút), đúng không? – Canavar

+0

Hãy cẩn thận về chính tả. Tôi nhận thấy bạn đang sử dụng cách viết "hành vi" của người Anh/Canada. Tất nhiên, IntelliSense sẽ bắt được điều đó. :) –

+0

@Canavar, đúng vậy. Tôi đang tìm một tính năng tương tự trong ImageButton. –

Trả lời

11

Tôi sẽ giả sử bạn có một số loại điều khiển đầu vào và bạn không muốn nhập phím để tự động gửi khi tai nạn người dùng nhấn phím enter. Nếu vậy bạn có thể đính kèm một sự kiện onkeypress javascript vào mỗi điều khiển mà bạn muốn vô hiệu hóa hành vi này.

function disableEnterKey(e) 
{ 
    var key; 
    if (window.event) key = window.event.keyCode; // Internet Explorer 
    else key = e.which; 

    return (key != 13); 
} 

// In your aspx file Page_Load do the following foreach control you want to disable 
// the enter key for: 
txtYourTextBox.Attributes.Add("OnKeyPress", "return disableEnterKey(event);"); 

Nếu bạn cần tắt hoàn toàn biểu mẫu gửi biểu mẫu. trường hợp sử dụng trình xử lý OnKeyDown trên thẻ <body> trên trang của bạn.

Mã javascript:

if (window.event.keyCode == 13) 
{ 
    event.returnValue = false; 
    event.cancel = true; 
} 

Với JQuery này sẽ được nhiều bụi, dễ dàng hơn và các phương pháp khuyến khích. Bạn có thể tạo tiện ích mở rộng với:

jQuery.fn.DisableEnterKey = 
    function() 
    { 
     return this.each(function() 
     { 
      $(this).keydown(function(e) 
      { 
       var key = e.charCode || e.keyCode || 0; 
       // return false for the enter key 
       return (key != 13); 
      }) 
     }) 
    }; 

// You can then wire it up by just adding this code for each control: 
<script type="text/javascript" language="javascript"> 
    $('#txtYourTextBox').DisableEnterKey(); 
</script> 
+0

tôi đã thử phương pháp này. asp: imagebutton doesn; t dường như xử lý sự kiện onKeyPress ở phía máy khách. Mã:

+0

Triển khai OnKeyPress khi bạn có sự kiện bên SERVER. Bạn cần kết nối nó với javascript. Tôi sẽ chỉnh sửa câu trả lời của tôi để hiển thị nó một cách chính xác. – Kelsey

+1

Việc đặt chức năng disableEnterKey đó vào sự kiện onkeydown của thẻ body sẽ có nghĩa là người dùng sẽ không thể thêm trả về vận chuyển vào hộp văn bản nhiều dòng. Ngoài ra đây là một chút buồn cười: nếu (key == 13) trả về false; khác trả lại đúng; –

1

Sử dụng asp: image thay thế. Sau đó, đặt một số mã javascript vào onclick "javascript:document.getElementById('imageClicked').setAttribute('value', 'true'); document.myform.submit();"

Đặt giá trị của trường ẩn (sử dụng javascript) để cho biết mã phía máy chủ mà hình ảnh được nhấp.

document.getElementById('imageClicked').setAttribute('value', 'true'); 

Sau đó, vào cuối xử lý postback trên máy chủ thiết lập lại giá trị của HiddenField:

document.getElementById('imageClicked').setAttribute('value', 'true'); 
+0

Bạn có thể vui lòng xây dựng? –

2

trả lời Sử dụng Kelsey của (Câu trả lời này được wiki'ed)

.. . nhưng xin lưu ý một vài điều khi bạn thực hiện nó.

  1. Tôi muốn đề xuất phương thức javascript cũ đơn giản nếu bạn chưa sử dụng jQuery. nếu bạn làm phương pháp đó, chỉ cần trả về (keynum! = 13) không làm điều gì ngớ ngẩn như thể (true) trả về true; khác trở về sai;

  2. Bạn không phải gán onkeydown từ mã phía sau. Điều đó có thể được thực hiện trong đánh dấu và nó sạch hơn rất nhiều khi bạn làm.

  3. Không tắt khóa nhập trong toàn bộ biểu mẫu của bạn. Bạn có thể làm điều đó trong đầu vào của bạn chỉ, nhưng nếu bạn làm điều đó trong toàn bộ hình thức bạn sẽ không thể thêm một vận chuyển trở lại trong một textarea.

  4. Nếu bạn sử dụng jQuery, tôi khuyên bạn nên thêm một lớp CSS có tên là "disableEnterKey" và gán nó cho các phần tử biểu mẫu bạn muốn vô hiệu hóa, sau đó gọi phương thức jQuery của Kelsey trên $ (". DisableEnterKey") tài liệu đã sẵn sàng.

  5. Đừng trả lời quá giống với bất kỳ ai trên SO, ngay cả khi bạn không hoàn toàn đồng ý với câu trả lời. Và ngay cả khi câu trả lời là đơn giản và hàng ngàn người có thể đã thực hiện việc samething. Đó là "sao chép". Mà là tương tự như là một "cắt" hoặc một "câu chuyện tattle" ... đó là xấu.

(câu trả lời này đã được cộng đồng wiki'ed như chủ đề câu hỏi này đã nhận ngớ ngẩn)

+0

Btw nhờ sao chép câu trả lời của tôi một ngày muộn và sau đó xuống bỏ phiếu cho câu trả lời của tôi. Bỏ phiếu xuống là vào thời điểm chính xác bạn đăng câu trả lời của bạn ... có thể chỉ là một sự trùng hợp ngẫu nhiên. – Kelsey

+0

Xin lỗi, tôi chưa bao giờ đọc toàn bộ bài đăng của bạn. Tôi thấy "nếu (đúng) trở lại đúng sự thật; ngược lại sai;" bit và thực tế bạn đã cho họ gán onkeydown từ mã phía sau và tìm phần còn lại của câu trả lời không đáng đọc. Bây giờ tôi đã đọc bài viết của bạn, bài viết của tôi là tương tự, nhưng có một số khác biệt cơ bản giữa hai phương pháp. Ví dụ: Tôi đề nghị họ thêm onkeydown vào đánh dấu. Tôi đang sử dụng một lớp css để tìm các đầu vào tôi muốn giết với jQuery. Tôi cũng sẽ không bao giờ khuyên bạn nên vô hiệu hóa phím enter ở khắp mọi nơi bên trong một biểu mẫu, vì điều đó sẽ làm rối loạn hành vi của văn bản. –

+0

Ở đó, tất cả đều tốt hơn. Tôi sẽ lấy điểm F trong bài kiểm tra, vì tôi đã sao chép rõ ràng một trong những thuật toán phức tạp và độc đáo nhất mà SO đã từng thấy. –

2

Mẫu này sẽ thực hiện vào nút đầu tiên mà nó tìm thấy trên trang khi bạn nhấn enter. Nếu bạn có thể di chuyển thêm ImageButton xuống dưới trang để nó không còn là nút đầu tiên trong đánh dấu và sử dụng CSS để định vị nó đúng cách, điều này sẽ khắc phục được sự cố của bạn. Tôi đã sửa lại chính xác điều đó vào tuần trước và điều này đã giúp tôi. Tôi đã đi với giải pháp này bởi vì nó không yêu cầu JavaScript để làm việc đúng cách.

7

Nếu bạn đặt nội dung của bạn trong một asp : Bảng điều chỉnh bạn có thể sử dụng DefaultButton tài sản để thiết lập một nút khác nhau như mặc định để nút hình ảnh của bạn sẽ không được bấm.

<asp:Panel runat="server" ID="pnl_Test" DefaultButton="btn_Test2"> 
    <asp:ImageButton runat="server" ID="btn_Test1" /> 
    <asp:Button runat="server" ID="btn_Test2" /> 
</asp:Panel> 

Trong ví dụ này btn_Test2 sẽ được bấm khi bạn nhấn enter nơi thường btn_Test1 sẽ được bấm

+0

Đó là một ý tưởng hay. Nhưng sẽ không làm việc trong trường hợp của tôi, vì nút hình ảnh của tôi là một phần của điều khiển người dùng khác. Vì vậy, tôi không thể buộc các điều khiển cha mẹ để thiết lập DefaultButton. –

+0

Tuyệt vời. Thậm chí làm việc nếu nút Hình ảnh là trước (bên ngoài) bảng điều khiển. – Jaider

1

bạn muốn một cái gì đó giống như

<form ...> 

    <!-- some code here --> 

    <button style='display:none' onclick='return false'>here comes the magic</button> 

    <button>normal button </button> 

</form> 
0

Hãy sử dụng mã này

<script type="text/javascript" language="javascript"> 
$(document).ready(function { 
    $("#<%=imageClicked.ClientID%>").prop('disabled',true) 
}); 
</script>