Question

我使用JS更改了我的网站顶部附近的HTML并且它无法正常工作我之前遇到了类似的问题，因为报价搞砸了但是我试图用这种方法解决它但它仍然没有工作

＆＃13;

function formSubmit(form) {

  console.log("Ajax Init");

  var data = new FormData(form), // simpler
    xhr = new XMLHttpRequest();

  for (var i = 0, ii = form.length - 1; i < ii; ++i) {
    var input = form[i];
    //data.append(input.name, input.value);
    if (input.getAttribute("name") !== "_gotcha") {
      if (input.value === "" || input.value === null || input.value === "undefined") {
        alert("Please fill out all form fields before submitting");
        // something went wrong, prevent form from submitting
        return false;
      }
    }
  }

  xhr.open(form.method.toUpperCase(), form.action, true);
  if (document.getElementById("_gotcha").value.length == 0) {
    xhr.send(data);
  } else {
    // something went wrong, prevent form from submitting
    return false;
  }

  xhr.onloadend = function() {
    // done
    for (var i = 0, ii = form.length - 1; i < ii; ++i) {
      var input = form[i];
      input.value = "";
    }

    alert("Message Sent - Thank You");
  };


  // everything went ok, submit form
  return true;
};

＆＃13;

Answer 1

document.getElementById("accTabs").innerHTML = "<a onclick=\"document.getElementById('id01').style.display='block'\" class=\"w3-bar-item w3-button\" id=\"log\"><i class=\"fas fa-users\"></i> SIGN IN</a>";

<div id="accTabs"></div>

请尝试使用此代码段。由于您错误地使用了引号，因此引发了您的错误。

document.getElementById("accTabs").innerHTML = "<a onclick="alert('ok')"></a>";

如果您尝试使用此代码，则双引号内的双引号将导致问题。您需要像下面这样更改以解决问题

document.getElementById("accTbs").innerHTML = "<a onclick=\"alert('ok')\"></a>";

您也可以使用ES6模板文字。那么你可以在字符串中使用双引号和单引号而没有任何问题。

document.getElementById("accTabs").innerHTML = `<a onclick="alert('ok')"></a>`;

Answer 2

document.getElementById("accTabs").innerHTML = "<a onclick=\" document.getElementById('id01').style.display='block'\" class=\"w3-bar-item w3-button\" id=\"log\"><i class=\"fas fa-users\"></i> SIGN IN</a>";

<div id="accTabs"></div>

Answer 3

尝试使用模板字符串，如下所示

document.getElementById("accTabs").innerHTML = `<a 
onclick="document.getElementById('id01').style.display='block'" class="w3-bar- 
item w3-button" id="log"><i class="fas fa-users"></i> SIGN IN</a>`;

这样可行。详细了解Templete字符串Here

Answer 4

只需使用"正确转义\"并使用'打包字符串，减少转义

document.getElementById("accTabs").innerHTML = '<a onclick="document.getElementById(\'id01\').style.display=\'block\'" class="w3-bar-item w3-button" id="log"><i class="fas fa-users"></i> SIGN IN</a>';

<div id="accTabs"></div>
<div id="id01" style="display: inline">id01</span>

此外，您还可以尝试使用ES6的反引号来完全避免转义。

document.getElementById("accTabs").innerHTML = `<a onclick="document.getElementById('id01').style.display='block'" class="w3-bar-item w3-button" id="log"><i class="fas fa-users"></i> SIGN IN</a>`;

<div id="accTabs"></div>
<div id="id01" style="display: inline">id01</span>

将html插入getElementById（＆＃34; id＆＃34;）。innerHTML

4 个答案: