亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

將按鈕添加到在 vue.js 中動態創建的表中

將按鈕添加到在 vue.js 中動態創建的表中

蝴蝶不菲 2023-06-29 20:55:05
我正在嘗試動態創建顯示在表的第五(最后)列中的按鈕,該表也是動態創建的。一切都被正確創建。但是,單擊按鈕后,不會觸發該功能。也許是因為我使用 vue.js 來開發我的前端。我嘗試在button.setAttribute('click', 'claim()')下面的代碼中使用“v-on:click”而不是“click”,但這沒有幫助。  var table = document.createElement('table')  for (var i = 1; i <= 5; i++) {    var th = document.createElement('th')    th.appendChild(header)    table.appendChild(th)  for (var j = 1; j <= 4; j++) {    var tr = document.createElement('tr')    for (var k = 1; k <= 5; k++) {      var td = document.createElement('td')      var node = document.createTextNode(k)      td.appendChild(node)      tr.appendChild(td)      if (k === 5) {        var button = document.createElement('input')        button.setAttribute('type', 'submit')        button.setAttribute('value', 'Purchase')        button.setAttribute('click', 'purchase()')        td.appendChild(button)      }    }    table.appendChild(tr)  }
查看完整描述

1 回答

?
慕后森

TA貢獻1802條經驗 獲得超5個贊

您需要用于addEventListener添加任何事件。例子 :button.addEventListener('click', purchase)


var app = document.getElementById("app");

var table = document.createElement('table');

app.appendChild(table)

for (var i = 1; i <= 5; i++) {

  var th = document.createElement('th')

  //th.appendChild(header)

  table.appendChild(th)

  for (var j = 1; j <= 4; j++) {

    var tr = document.createElement('tr')

    for (var k = 1; k <= 5; k++) {

      var td = document.createElement('td')

      var node = document.createTextNode(k)

      td.appendChild(node)

      tr.appendChild(td)

      if (k === 5) {

        var button = document.createElement('input')

        button.setAttribute('type', 'submit')

        button.setAttribute('value', 'Purchase')

        button.addEventListener('click', purchase)

        td.appendChild(button)

      }

    }

    table.appendChild(tr)

  }

}


function purchase() {

  console.log("done")

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>


<div id='app'>


</div>


查看完整回答
反對 回復 2023-06-29
  • 1 回答
  • 0 關注
  • 202 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號