將子范圍更改為調用函數的鏈接

Question

我有一個AJAX函數，該函數將數據范圍內的div填充到模板中。 我想將這些范圍附加到鏈接，單擊該鏈接時將調用一個函數。 有了我所擁有的功能，似乎確實添加了href鏈接，但是文本本身仍然不可單擊。

這是來自IDE以及IE中開發人員工具的html：

 <div id="subtotal_menu">
    </div>

到目前為止，這是我嘗試過的：

 var $menu = $('#subtotal_menu');
 $menu.empty();
 $('#checkTemplate').tmpl(data.d.Checks).appendTo($menu);
 $("#subtotal_menu").find("span").attr('href','myfunction()');

還嘗試創建一個單獨的函數來對DOM元素進行操作：

    function createVendorInvoiceLinks() {
           var subTotalmenu = document.getElementById("#subtotal_menu").find("span");
           var aTag = document.createElement('a');
           aTag.setAttribute('href', "myfunction()");
           subTotalmenu.appendChild(aTag); 
           }

Answer 1

這可以幫助您：

var $menu = $('#subtotal_menu');
$menu.find("span").append('<a href="javascript:void(0)">Link</a>');
// append an anchor to the span inside #subtotal_menu
// set javascript:void(0) as href to avoid unwanted behaviour on click

$('#subtotal_menu').on('click', 'a',function(){
    alert('clicked');
    // do whatever myfunction() does
});
//set up a proper event handler and use event-delegation to cope with 
//dynamic added element from e.g. your mentioned ajax-request

當您希望整個范圍都可單擊時，只需將事件處理程序的綁定從a更改為span 。 這樣，您就不必附加錨點了。

---

例

---

參考

jQuery .append（）

事件委托

Answer 2

而不是將<a>元素附加到范圍，您應該執行相反的操作：

function createVendorInvoiceLinks() {
       var subTotalmenu = document.getElementById("#subtotal_menu").find("span");
       var aTag = document.createElement('a');
       aTag.setAttribute('href', "myfunction()");
       aTag.appendChild(subTotalmenu); 
       }

因此，您不會生成沒有內容的<a> 。