Question

我提前道歉，这是我发布的第一个Stack Overflow问题。我的任务是为学区的技术服务台创建一个符合ADA标准的新网站。我从最初的HTML知识开始，一直在通过w3cschools自学。所以这是我的痛苦：

我需要为所有pdf和html指南创建一个页面。我正在尝试创建一个非常简单的可交互式菜单，并将从onclick事件中填充链接数组，但title =“”text属性会删除第一个空格后的所有内容，并且我尝试使用replace（）失败了方法因为它来自数组而不是静态文本。

我知道我可能应该使用一个例子，但我的工作日即将结束，我想发布这个，所以我只是复制了一些我的实际代码。

所以这就是正在发生的事情，在var gmaildocAlt的示例1中，工具提示会删除Google之后的所有内容，但会使用示例2正确显示整个字符串。我希望为其他帮助台人员创建表单输入以添加链接知道如何编码，但无法用

解决示例1的问题

var fix = gmaildocAlt.replace（/ / g，“＆amp; nb sp;”）

//减去空间

//如果我将其设置在其他变量

之下，这也会破坏整个函数

我确信有很多事情我做错了，但我真的很感激最小的提示，让我的工具提示正确显示，而无需更换方法。

//	GMAIL----------------------------
function gmailArray() {
  var gmaildocLink = ['link1', 'link2'];
  var gmaildocTitle = ["title1", "title2"];
  var gmaildocAlt = ["Google Cheat Sheet For Gmail", "Google&nbsp;10-Minute&nbsp;Training&nbsp;For&nbsp;Gmail"];
  var gmailvidLink = [];
  var gmailvidTitle = [];
  var gmailvidAlt = [];
  if (document.getElementById("gmailList").innerHTML == "") {
    for (i = 0; i < gmaildocTitle.length; i++) {
      arrayGmail = "<a href=" + gmaildocLink[i] + " " + "title=" + gmaildocAlt[i] + ">" + gmaildocTitle[i] + "</a>" + "<br>";
      document.getElementById("gmailList").innerHTML += arrayGmail;
    }
    for (i = 0; i < gmailvidTitle.length; i++) {
      arrayGmail1 = "";
      document.getElementById("").innerHTML += arrayGmail1;
    }
  } else {
    document.getElementById("gmailList").innerHTML = "";
  }
}

<div class="fixed1">
  <p id="gmail" onclick="gmailArray()" class="gl">Gmail</p>
  <ul id="gmailList"></ul>
  <p id="calendar" onclick="calendarArray()" class="gl">Calendar</p>
  <ul id="calendarList"></ul>
</div>

Answer 1

使用字符串手动构建HTML可能会导致此类问题。最好一次一步地构建它们，让框架处理引用和特殊字符 - 如果你使用的是jQuery，它可能是：

var $link = jQuery("<a></a>")
    .attr("href", gmaildocLink[i])
    .attr("title", gmaildocAlt[i])
    .html(gmaildocTitle[i]);
jQuery("#gmailList").append($link).append("<br>");

没有jQuery，比如：

var link = document.createElement("a");
link.setAttribute("href", gmaildocLink[i]);
link.setAttribute("title", gmaildocAlt[i]);
link.innerHTML = gmaildocTitle[i];
document.getElementById("gmailList").innerHTML += link.outerHTML + "<br>";

如果对您的受众群体很重要，setAttribute在IE7中不起作用，您必须将这些属性作为元素的属性进行访问：link.href = "something";。

Answer 2

如果您添加＆＃39;在变量字符串的任一侧，它将确保整个值被读取为单个字符串。最初，它假设空间正在退出Title属性。

希望以下有帮助！

更新：如果你担心在标题字符串中使用撇号，你可以使用＆＃34;通过逃避他们。这迫使JS将其作为字符读取，而不是作为代码结构的一部分。请参阅下面的示例。

感谢您指出这个人！我这是邋code的代码。

＆＃13;

//	GMAIL----------------------------
function gmailArray() {
  var gmaildocLink = ['link1', 'link2'];
  var gmaildocTitle = ["title1", "title2"];
  var gmaildocAlt = ["Google's Cheat Sheet For Gmail", "Google 10-Minute Training For Gmail"];
  var gmailvidLink = [];
  var gmailvidTitle = [];
  var gmailvidAlt = [];
  if (document.getElementById("gmailList").innerHTML == "") {
    for (i = 0; i < gmaildocTitle.length; i++) {
      var arrayGmail = "<a href=" + gmaildocLink[i] + " title=\"" + gmaildocAlt[i] + "\">" + gmaildocTitle[i] + "</a>" + "<br>";
      document.getElementById("gmailList").innerHTML += arrayGmail;
    }
    for (var i = 0; i < gmailvidTitle.length; i++) {
      var arrayGmail1 = "";
      document.getElementById("").innerHTML += arrayGmail1;
    }
  } else {
    document.getElementById("gmailList").innerHTML = "";
  }
}

＆＃13;

<div class="fixed1">
   <p id="gmail" onclick="gmailArray()" class="gl">Gmail</p>
   <ul id="gmailList"></ul>
   <p id="calendar" onclick="calendarArray()" class="gl">Calendar</p>
   <ul id="calendarList"></ul>
</div>

＆＃13;

第一个空格后，文本字符串输出停止，js / html

2 个答案: