我的项目中的 href 链接不可点击，我有这个 HTML 和 javascript，并且 HTML 中的 href 不可点击，它们应该显示我的购物车。有人可以帮我找出问题所在吗？我尝试了一切方法来解决这个问题。
<!DOCTYPE html>
<html>
<head>
<title>Words</title>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<link rel="stylesheet" href="words.css" type="text/css"/>
<script type="text/javascript" src="words.js"></script>
</head>
<body>
<h1>Shopping Cart</h1>
<div>
<ul>
<li><a class="add-to-cart" href="#" data-name="Apple" data-price="1.22">
</a>Apple $1.22</li>
<li><a class="add-to-cart" href="#" data-name="Banana" data-price="1.33">
</a>Apple $1.22</li>
<li><a class="add-to-cart" href="#" data-name="Shue" data-price="22.33">
</a>Apple $1.22</li>
<li><a class="add-to-cart" href="#" data-name="Frisbee" data-price="5.22">
</a>Apple $1.22</li>
</ul>
<button id="clear-cart">Clear cart</button>
</div>
<div>
<ul id="show-cart">
<li></li>
</ul>
</div>
</body>
</html>
JavaScript
$(".add-to-cart").click(function(event) {
event.preventDefault();
var name = $(this).attr("data-name");
var price = Number($(this).attr("data-price"));
addItemToCart(name, price, 1);
displayCart();
});
function displayCart() {
var cartArray = listCart();
var output = "";
for (var i in cartArray) {
output += "<li>" + cartArray[i].name + " " + cartArray[i].count + "</li";
}
$("#show-cart").html(output);
}
});
最佳答案
您的链接不可用，因为您将标签结尾发布在错误的位置。 这是正确的代码:
<ul>
<li><a class="add-to-cart" href="#" data-name="Apple" data-price="1.22">
Apple $1.22</a></li>
<li><a class="add-to-cart" href="#" data-name="Banana" data-price="1.33">
Apple $1.22</a></li>
<li><a class="add-to-cart" href="#" data-name="Shue" data-price="22.33">
Apple $1.22</a></li>
<li><a class="add-to-cart" href="#" data-name="Frisbee" data-price="5.22">
Apple $1.22</a></li>
</ul>
在 HTML5 和旧版本中，结束标签应始终按正确的顺序，例如:
<tag1><tag2><tag3></tag3></tag2></tag1>
如果您使用链接标记，您应该记住在内容末尾张贴结束标记，该标记将易于使用，例如:
<a href="someurl.html"> Clicable content </a>
关于javascript - 我的项目中的 href 链接不可点击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45899192/