簡體   English   中英

如何使用JavaScript創建動態a-tag onclick調用外部函數

[英]How to create dynamic a-tag onclick to call external function using javascript

我正在與ajax請求一起進行laravel項目。 我可以收到來自控制器的響應,如下所示。

    success:function(response){
         var output = "";
         $.each(response, function(i, item) {
            var room = item.room;
            var route = `{{url('medicalroom/callque/${id}')}}`;                    
            output += `<a onclick="confirmation(event)" href="${route}" '>Room ${("00" + room).slice(-2)} </a>`;
            })
         $('#roomlist').html(output);
     }

    function confirmation(e) {
        e.preventDefault();
        alert(route);
    });

我可以將結果添加到div roomlist但一旦執行onclick則不會觸發事件。 任何建議或指導將不勝感激,謝謝。

您可以嘗試類似的操作,不要將調用添加到onclick,而要使用某個類,然后從鏈接的href獲取路由,也可以將其存儲在data-route=${route}屬性中並獲取它像$(this).data('route')

  $(function(){ function func(response) { var output = ""; $.each(response, function(i, item) { var room = item.room; var route = `medicalroom/callque/4`; output += `<a class='link' href="${route}" '>Room ${("00" + room).slice(-2)} </a>`; }) $('#roomlist').html(output); } var resp = [{room: '001'}, {room: '002'}, {room: '003'}, {room: '004'}, {room: '005'}]; func(resp) $(document).on('click', '.link', function(e){ e.preventDefault(); alert(this.href); }) }) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="roomlist"></div> 

代替

$('#roomlist').html(output);

您可以嘗試使用ajax中的append()attr()將屬性添加為輸入類型或href標簽。

嘗試這個 。 為href標簽創建一個ID

<a href = "#" id = "hello1">

在ajax響應中,

$('#hello1').attr('onclick','confirmation(event)');

為onclick事件添加另一個函數(確認),然后在該函數中執行其他操作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM