我试图运行此链接上提供的代码：http://www.bootply.com/wafppXvbD1
但是，当我尝试运行它时，所有内容均按预期显示，但该按钮不起作用。
<head>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/core.css">// This one contains the css code that is given inside the link
<link rel="stylesheet" href="css/bootstrap-anchor.css">
<link rel="stylesheet" href="css/bootstrap-theme.css">
<script src="css/bootstrap-anchor.css"></script>
<script src="js/review.js"></script> // This is the Js that is given inside the link and i have saved on this one.
<script src="js/bootstrap-anchor.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/npm.js"></script>
</head>
这是我在主页顶部导入的内容。由于我不熟悉引导程序，因此我不知道其他脚本的确切功能以及如何执行。这就是为什么我导入所有内容以确保其正常工作的原因。
我在做什么错？
最佳答案
一切工作正常检查
$(function(){
var reviewBox = $('.AT3RevPostBox');
var newReview = $('.AT3RevPostTextArea');
var openReviewBtn = $('.AT3RevPostOpenBtn');
var closeReviewBtn = $('.AT3RevPostCloseBtn');
openReviewBtn.click(function(e)
{
reviewBox.slideDown(400, function()
{
newReview.trigger('autosize.resize');
newReview.focus();
});
openReviewBtn.fadeOut(100);
closeReviewBtn.show();
});
closeReviewBtn.click(function(e)
{
e.preventDefault();
reviewBox.slideUp(300, function()
{
newReview.focus();
openReviewBtn.fadeIn(200);
});
closeReviewBtn.hide();
});
});
$(".AT3RevStar").hover(function(event) {
var target = $( event.target );
if ( target.is( "span" ) )
{
target.removeClass("glyphicon-star-empty").addClass("glyphicon-star");
target.nextAll("span").removeClass("glyphicon-star").addClass("glyphicon-star-empty");
target.prevAll("span").removeClass("glyphicon-star-empty").addClass("glyphicon-star");
}
});
$(".AT3RevStarWrap").mouseleave(function(event) {
var starWrapEl = $(this);
var children = starWrapEl.children("span");
var input = starWrapEl.find(":input").eq(0);
var rating = parseInt(input.val(),10);
for (i = 0; i < rating; i ++)
{
var child = $(children[i]);
child.removeClass("glyphicon-star-empty").addClass("glyphicon-star");
}
for (i = rating ; i < children.length; i ++)
{
var child = $(children[i]);
child.removeClass("glyphicon-star").addClass("glyphicon-star-empty");
}
});
$(".AT3RevStar").click(function(event) {
var target = $( event.target );
var rating = target.prevAll("span").length + 1;
var input = target.parent().find(":input").eq(0);
input.val (rating);
});body {
margin: 10px;
}
.AT3RevLarge
{
font-size:40px;
}
.AT3RevSummary
{
padding:10px;
vertical-align:top;
}
.AT3RevStar
{
font-size:20px;
cursor:pointer;
}
.AT3RevText1{
vertical-align: middle; padding-left: 10px; text-align:left;
}
.AT3RevName
{
font-weight:bold;border-right:2px solid lightgray;padding-right:5px;
}
.AT3RevDate{
color:gray;
padding-left:5px;
padding-right:5px;
border-right:2px solid lightgray;
}
.AT3RevPostBox
{
display: none;
}
.AT3RevPostCloseBtn{
margin-right: 10px;
}<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<div class="container-fluid">
<div class="row">
<div class="col-sm-4 AT3RevSummary text-center">
<div class="AT3RevLarge">
83%
</div>
<div style="font-size: 20px;">
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
</div>
<div>
Based on <span style="font-weight: bold">12</span> reviews
</div>
</div>
<div class="col-sm-4 AT3RevSummary text-center">
<div>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span style="font-weight:bold;">15</span> customers
</div>
<div>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span style="font-weight:bold;">15</span> customers
</div>
<div>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span style="font-weight:bold;">15</span> customers
</div>
<div>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span style="font-weight:bold;">15</span> customers
</div>
<div>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span style="font-weight:bold;">15</span> customers
</div>
</div>
<div class="col-sm-4 text-center AT3RevSummary">
<table style="margin: 0 auto">
<tbody>
<tr>
<td class="AT3RevLarge">83
</td>
<td class="AT3RevText1">customers already purchased
</td>
</tr>
<tr>
<td class="AT3RevLarge">60
</td>
<td class="AT3RevText1">of customers recommend
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="well well-sm">
<div class="text-right">
<a class="btn btn-success btn-green AT3RevPostOpenBtn" href="#reviews-anchor">Leave a Review</a>
</div>
<div class="row AT3RevPostBox">
<div class="col-md-12">
<textarea class="form-control AT3RevPostTextArea" cols="50" placeholder="Enter your review here..." rows="5"></textarea>
<div class="text-right">
<div class="AT3RevStarWrap">
<input value="0" type="hidden">
<span class="glyphicon glyphicon-star-empty AT3RevStar "></span>
<span class="glyphicon glyphicon-star-empty AT3RevStar"></span>
<span class="glyphicon glyphicon-star-empty AT3RevStar"></span>
<span class="glyphicon glyphicon-star-empty AT3RevStar"></span>
<span class="glyphicon glyphicon-star-empty AT3RevStar"></span>
</div>
<a class="btn btn-danger btn-sm AT3RevPostCloseBtn" href="#">
<span class="glyphicon glyphicon-remove"></span>Cancel</a>
<button class="btn btn-success btn-lg" type="submit">
<span class="glyphicon glyphicon-ok"></span> Save
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="well well-sm">
<div>
<span class="AT3RevName">Brian</span>
<span class="AT3RevDate">22.10.2015</span>
<span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
</span>
</div>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis dolor, in sagittis nisi. Sed ac orci quis tortor
imperdiet venenatis. Duis elementum auctor accumsan. Aliquam in felis sit amet augue.
</div>
</div>
<div class="well well-sm">
<div>
<span class="AT3RevName">Brian</span>
<span class="AT3RevDate">22.10.2015</span>
<span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star"></span>
<span class="glyphicon glyphicon-star-empty"></span>
<span class="glyphicon glyphicon-star-empty"></span>
</span>
</div>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero. Aenean sit amet felis dolor, in sagittis nisi. Sed ac orci quis tortor
imperdiet venenatis. Duis elementum auctor accumsan. Aliquam in felis sit amet augue.
</div>
</div>