为什么onclick()在button标记内不起作用?

时间:2018-08-20 02:25:16

标签: javascript oop

我将onclick()放在了button标记内,但是却给了我SyntaxError

如果要单击每行右上角的button,我想删除每行。

var firstName = document.getElementById("txtFName");
var lastName = document.getElementById("txtLName");
var sex = document.getElementById("selSex");
var age = document.getElementById("txtAge");
var indice = [];
var id = 1;
var remove = "Remove";


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

function remove(indice) { //remove row one by one
  for(var i = 0; i < indice.length; i++)
      myArray.splice(indice, 1);

}

function print() {
  var objPerson = new Person(id, firstName.value, lastName.value, selSex.value, age.value, remove); //instantiation 
  var display = "";


  display += "<tr>";

    display += "<td>" + objPerson._id + "</td>";
    display += "<td>" + objPerson._firstName + "</td>";
    display += "<td>" + objPerson._lastName + "</td>";
    display += "<td>" + objPerson._sex + "</td>";
    display += "<td>" + objPerson._age + "</td>";
    display += "<td>" + "<button onclick = "remove()">" + objPerson._remove + "</button>" + 
    "</td>"; //onclick gives me a SyntaxError


  display += "</tr>";
  tblPerson.innerHTML += display; //display the output many times
  id++; //increment id
}

1 个答案:

答案 0 :(得分:1)

因为这行有串联错误

display += "<td>" + "<button onclick = "remove()">" + objPerson._remove + "</button>"

应该是

display += "<td>" + "<button onclick = 'remove()'>" + objPerson._remove + "</button>"

display += "<td>" + "<button onclick = \"remove()\">" + objPerson._remove + "</button>"

除非我认真建议不要串联html字符串,因为它根本不优雅也不灵活。改用document.createElement()。