0

我正在用javascript编写一个html结构,单击链接时需要返回它。我有这样的

  return '<div class="contactForm">'+
'<input type="text" name="contactName" onBlur="if (this.value == "") {this.value == "Name";}" onFocus="if ((this.value == "") || (this.value == "Name")) {this.value = "";};" value="Name" style="">'+

当我在页面上看到它时,onBlur属性显示为红色并且引号放错了位置。我在页面上看到它是这样的。

   <input name="contactName" onblur="if (this.value == " ")="" {this.value="Name" ;}"="" onfocus="if ((this.value == " ||="" (this.value="=" "name"))="" ;};"="" value="Name" style="" type="text">

如何编写返回部分以便在 HTML 页面中正确使用它?我相信这是由于引号放错了位置。我在页面源代码中看到了这个错误,在期望属性名称时看到了引号

4

2 回答 2

2

您需要使用 \\\: 对字符串内的引号进行双重转义,一次用于字符串本身,一次用于内联 JavaScript。

return '<div class="contactForm">'+
    '<input type="text" name="contactName" onBlur="if (this.value == \\\"\\\") {this.value == \\\"Name\\\";}" onFocus="if ((this.value == \\\"\\\") || (this.value == \\\"Name\\\")) {this.value = \\\"\\\";};" value="Name" style="">'+

如果你想让它更易读,你可以使用只需要转义一次的单引号。

return '<div class="contactForm">'+
    '<input type="text" name="contactName" onBlur="if (this.value == \'\') {this.value == \'Name\';}" onFocus="if ((this.value == \'\') || (this.value == \'Name\')) {this.value = \'\';};" value="Name" style="">'+
于 2013-03-22T06:20:42.097 回答
1
var element = '<div class="contactForm">';
element += '<input type="text" name="contactName" onBlur="if (this.value == \'\') {this.value == \'Name\';}" onFocus="if ((this.value == \'\') || (this.value == \'Name\')) {this.value = \'\';};" value="Name" style="">';
element += '</div>';

return element;
于 2013-03-22T06:21:45.110 回答