JQuery .html不能在href中添加变量值



我想在我的网页上创建一个新闻列表。当鼠标点击内容时,会有一个url可用。例如apple news

这里是我的示例代码,我的问题是:当我试图添加一个变量的值到href,像href="www.search.com?keyword="+var.keyword,它将显示apple news

实际上在变量模型中有50个对象,所以它将有50个模型。链接和建模。关键词,请帮助我改变在w3cshools.com上工作的示例代码"自己试试"。我试了10次,真的不知道如何修复它,谢谢!

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
<!-- should end this tag-->
var model=[{"link":"http://www.google.com?keyword=","keyword":"apple" "content":"This is a news"}]
<!-- miss a ";" at the end of line -->
</script>
<script>
$(document).ready(function(){
$("p").html("Click <a href=model.link+model.keyword>this link</a>");
<!--Finally this works: $("p").html("Click <a href='"+model[0].link+model[0].keyword+"'>this link</a>");-->
});
</script>
</head>
<body>
<p>A content</p>
</body>
</html>

正确引用:

$("p").html("Click <a href="+model.link+model.keyword+">this link</a>");

您的model变量中缺少逗号::

var model=[
  {
    "link":"http://www.google.com?keyword=",
    "keyword":"apple",
    "content":"This is a news"
  }
];

由于它是对象数组,您需要像model[0].link一样访问它以从model数组中获取第一个对象,如:

$(document).ready(function(){
    $("p").html("Click <a href='"+model[0].link+model[0].keyword+"'>this link</a>");
});

正确放置链接

$("p").html("Click <a href='"+model.link+model.keyword+"'>this link</a>");

这就是你需要的:

var model=[ { link:'http://www.google.com?keyword=', keyword: 'apple', content: 'This is a news'} ];
$.each( model, function( key, value ) {
   $('p').append('Click <a href="' + value.link+ value.keyword + '">this link</a>');
});

需要循环遍历对象数组并获取值。您可以使用$。因为你正在使用jQuery,虽然你可以很容易地做到这一点与香草Javascript,我也会在Javascript的单引号包装字符串的做法,这样你可以添加双引号在一个很好的可读性语法的HTML字符串,你将添加到DOM。

请注意,我也没有对对象关键字使用引号。

看到小提琴:http://jsfiddle.net/r8MQ9/1/

最新更新