JavaScript: thay đổi giá trị của onclick có hoặc không có jQuery

Tôi muốn thay đổi giá trị của thuộc tính onclick trên một neo. Tôi muốn đặt nó vào một chuỗi mới có chứa JavaScript. (String đó được cung cấp cho các client-side mã JavaScript bởi máy chủ, và nó có thể chứa bất cứ điều gì bạn có thể đặt trong onclick thuộc tính trong HTML.) Dưới đây là một vài điều tôi đã cố gắng:JavaScript: thay đổi giá trị của onclick có hoặc không có jQuery

Sử dụng jQuery attr("onclick", js) doesn không hoạt động với cả Firefox và IE6/7.
Sử dụng setAttribute("onclick", js) hoạt động với Firefox và IE8, nhưng không hoạt động với IE6/7.
Sử dụng onclick = function() { return eval(js); } không hoạt động vì bạn không được phép sử dụng return là mã được chuyển đến eval().

Bất kỳ ai có đề xuất bật đặt thuộc tính onclick để thực hiện công việc này cho Firefox và IE 6/7/8? Ngoài ra, hãy xem bên dưới mã tôi đã sử dụng để kiểm tra điều này.

<html> 
    <head> 
     <script type="text/javascript" 
       src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       var js = "alert('B'); return false;"; 
       // Set with JQuery: doesn't work 
       $("a").attr("onclick", js); 
       // Set with setAttribute(): at least works with Firefox 
       //document.getElementById("anchor").setAttribute("onclick", js); 
      }); 
     </script> 
    </head> 
    <body> 
     <a href="http://www.google.com/" id="anchor" onclick="alert('A'); return false;">Click</a> 
    </body> 
</html>

Nguồn

2009-05-05 avernet

"có hoặc với jQuery" bạn có muốn jQuery với jQuery đó không? –

Tôi giả định OP muốn jQuery trong khi anh ta jQueried. – ObscureRobot

Bạn không nên sử dụng onClick nữa nếu bạn đang sử dụng jQuery. jQuery cung cấp các phương thức gắn và ràng buộc các sự kiện riêng của nó. Xem .click()

$(document).ready(function(){ 
    var js = "alert('B:' + this.id); return false;"; 
    // create a function from the "js" string 
    var newclick = new Function(js); 

    // clears onclick then sets click using jQuery 
    $("#anchor").attr('onclick', '').click(newclick); 
});

Điều đó sẽ hủy onClick chức năng - và giữ "javascript từ một chuỗi" của bạn là tốt.

Điều tốt nhất cần làm là xóa từ phần tử <a> trong mã HTML và chuyển sang sử dụng phương pháp Unobtrusive để ràng buộc sự kiện để nhấp.

Bạn cũng cho biết:

Sử dụng onclick = function() { return eval(js); } không làm việc vì bạn không được phép sử dụng trở lại trong mã truyền cho eval().

Không - nó sẽ không, nhưng onclick = eval("(function(){"+js+"})"); sẽ bọc biến 'js' trong vỏ chức năng. onclick = new Function(js); hoạt động tốt và sạch hơn một chút để đọc. (lưu ý số vốn F) - xem documentation on Function() constructors

Nguồn

2009-05-05 20:07:24 gnarf

attr ('onclick', '') không hoạt động, bạn sẽ cần phải sử dụng removeAttr ('onclick') –

Hãy coi chừng điều này là tốt: jQuery unbind() vs removeAttr() xem http: // www. novogeek.com/post/2009/05/18/Beware-e28093-jQuery-unbind()-vs-removeAttr().aspx – benjaminlotan

Điều này đã cứu mạng tôi, làm việc đó hàng giờ! –

One gotcha với Jquery là chức năng nhấp chuột không thừa nhận bàn tay được mã hóa trên nhấp chuột từ html.

Vì vậy, bạn có khá nhiều lựa chọn. Thiết lập tất cả các trình xử lý của bạn trong hàm init hoặc tất cả chúng trong html.

Sự kiện nhấp chuột trong JQuery là hàm nhấp chuột $ ("myelt") .nhấp (chức năng ....).

Nguồn

2009-05-05 19:56:31

Tom, tôi không thể sử dụng $ ("myelt"). Click() ở đây vì mã tôi muốn chạy nằm trong một chuỗi. (Xem bình luận của tôi cho các câu trả lời khác ở đây.) – avernet

Ah. Tôi thấy làm thế nào về: function js() {alert ('B'); return false; } –

chỉ cần sử dụng phương thức liên kết jQuery! jquery-selector! .bind ('event',! fn!);

See here for more about events in jQuery

Nguồn

2009-05-05 20:12:45

-3

đã đưa ra một sửa chữa nhanh chóng và dơ bẩn này. Chỉ cần sử dụng <select onchange='this.options[this.selectedIndex].onclick();> <option onclick='alert("hello world")' ></option> </select>

Hope this helps

Nguồn

2009-11-02 13:14:00 Afterburner

Mmmh ... xin lỗi nhưng tôi không thấy câu trả lời cho câu hỏi này như thế nào. – avernet

Nếu bạn không muốn thực sự hướng đến một trang mới, bạn cũng có thể neo của bạn ở đâu đó trên trang như thế này.

<a id="the_anchor" href="">

Và sau đó gán chuỗi lại Javascript để các các onclick của neo, đặt ở một nơi khác (ví dụ: tiêu đề, sau đó trong cơ thể, bất cứ điều gì):

<script> 
    var js = "alert('I am your string of JavaScript');"; // js is your string of script 
    document.getElementById('the_anchor').href = 'javascript:' + js; 
</script>

Nếu bạn có tất cả các thông tin này trên máy chủ trước khi gửi ra trang, sau đó bạn cũng có thể chỉ cần đặt JavaScript trực tiếp trong href thuộc tính của neo như sau:

<a href="javascript:alert('I am your script.'); alert('So am I.');">Click me</a>

Nguồn

2009-11-02 13:41:20 ntownsend

Lưu ý rằng followi ý tưởng ng gnarf của bạn cũng có thể làm:

var js = "alert('B:' + this.id); return false;";<br/> 
var newclick = eval("(function(){"+js+"});");<br/> 
$("a").get(0).onclick = newclick;

Điều đó sẽ thiết lập các onclick mà không gây ra sự kiện (có cùng một vấn đề ở đây và nó đã cho tôi một thời gian để tìm hiểu).

Nguồn

2009-11-04 21:03:09 Eduardo

BTW, mà không JQuery này cũng có thể được thực hiện, nhưng rõ ràng nó khá xấu xí như nó chỉ xem xét IE/không IE:

if(isie) 
    tmpobject.setAttribute('onclick',(new Function(tmp.nextSibling.getAttributeNode('onclick').value))); 
else 
    $(tmpobject).attr('onclick',tmp.nextSibling.attributes[0].value); //this even supposes index

Dù sao, chỉ cần để mọi người có một ý tưởng chung của những gì có thể thực hiện, như tôi chắc chắn nhiều người đã tình cờ gặp khó chịu này.

Nguồn

2009-11-04 21:18:28 Eduardo

JavaScript: thay đổi giá trị của onclick có hoặc không có jQuery

Trả lời

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