将javascript变量添加到脚本中的超链接

时间:2013-01-11 03:08:36

标签: javascript jquery jquery-isotope

我一直在尝试使用之前在同一函数中定义的变量创建一个超链接来追加:

var NAMEVARIABLE = responseArray[i].Name;

var TITLE_Game = document.createElement("p");
TITLE_Game.className = "TITLE_Game";
TITLE_Game.innerHTML = "<a href='Game_NAMEVARIABLE.html'>Games</a>";

我使用此处找到的解决方案尝试了以下内容:Passing Javascript variable to <a href >

<a href="Game_.html" onclick="location.href=this.href+'?key='+NAMEVARIABLE;return false;">Games</a>

但那没用。然后我尝试添加ID:

<a id="link" href="Game_.html?propid=">Games</a>

并将其添加到脚本中:document.links["link"].href += NAMEVARIABLE;

这也不起作用。这些链接发生在Isotope中,我遇到了新手问题,确保在脚本执行之前加载我的JSON数据。现在一切正常,但我不确定上述方法不起作用的原因是因为类似的问题,还是因为它们不是正确的解决方法。

非常感谢任何帮助。谢谢

4 个答案:

答案 0 :(得分:1)

首先,尝试调试你的变量:

var NAMEVARIABLE = responseArray[i].Name;
alert(NAMEVARIABLE);

是否返回所需的返回值。 然后第二件事,在你的第一种脚本风格中,试试这个:

TITLE_Game.innerHTML = "<a href='Game_"+NAMEVARIABLE+".html'>Games</a>";

我假设你有game_[number_id].html格式的(静态)html集合 如果是这样,您可以尝试使用第二种脚本,并将其更改为:

<a href="#" onclick="location.href='Game_'+NAMEVARIABLE+'.html';return false;">Games</a>

您需要进一步了解javascript strings concatenation

答案 1 :(得分:0)

使用字符串连接来构建内部html字符串。

示例:

var nameVariable = 'Foo';
var innerHtmlText = nameVariable + 'bar'; 

$('#someElement').html(innerHtmlText);

someElement的内容将包含文本:'Foobar';

答案 2 :(得分:0)

这可以通过任何方式(即纯JSjQuery)方式实现,而不会有太多麻烦。假设您的<a>元素包含href

<a id="Link" href="/collection/categories/">Games</a>

纯JavaScript方式:

window.onload = function() {
  var link= document.getElementById('Link'),
  url = link.href + responseArray[i].Name + '.html';

  link.setAttribute('href', url);
}

使用Jquery:

$(function(){
  var link= $('#Link'),
  url = link.attr('href') + responseArray[i].Name + '.html';

  link.attr('href', url);
}); 

答案 3 :(得分:0)

你只需要字符串连接。在大多数现代浏览器中,修改链接的href onclick将被视为垃圾邮件。

<div id="result">
  the result: 
</div>
<script type="text/javascript">
var name = "foo_bar";
var url = "page.html?key=" + name; //or.. "page_" + name + ".html";
var link = '<a href="' + url +'">link here</a>';

$("#result").addClass("g_title");
$("#result").append(link);
</script>