更改jQuery中按钮的高度，使用.css不起作用

问题描述：

我有div和按钮。 .buttons大小不变。更改jQuery中按钮的高度，使用.css不起作用

（的script.js是在同一目录中的HTML索引文件。）

$(document).ready(function(){ 
 
    $('#next').click(function(){ 
 
     $('.button').css('height','1200'); 
 
    }); 
 
});

<html> 
 
<head> 
 
<link href="style.css" rel="stylesheet" type="text/css" /> 
 
<script type="text/javascript" src="script.js" ></script> 
 
<title></title> 
 
</head> 
 
<body> 
 

 
    <div id="slide_container"> 
 
     <div id="slide"> 
 

 
     </div> 
 
     <a id='next' href="#">Next One</a> 
 
     <input type="button" id="btnPrev" value="Prevous" class="button"/> 
 
     <input type="button" id="btnNext" value="Next" class="button"/> 
 
    </div> 
 

 
</body> 
 
</html>

你在JavaScript控制台中有什么错误？ – 2012-02-01 13:22:36

假如你已经在页面上包含了jQuery，你有什么工作，script.js包含什么？这是一个工作版本：http://jsfiddle.net/hQNWy/7/ – 2012-02-01 13:24:11

适用于我：http://jsfiddle.net/Rq7xa/ – Jamiec 2012-02-01 13:25:23

答

我想你还没有包含jQuery库。

尝试包括错误控制台

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

比我快4秒;） – Archer 2012-02-01 13:25:14

可能值得添加，您可以使用Google CDN来源jQuery库'' – ianbarker 2012-02-01 13:34:48

好的...... – GoodSp33d 2012-02-01 14:07:46

答

没有进一步的信息，我只能假设的影响之前采取该链接被跟踪为了避免这种情况（并且为了防止链接被跟着（和打开新页面））：

$('#next').click(function(){ 
    $('.button').css('height','1200'); 
    return false; 
});

JS Fiddle demo。

返回FALSE既防止元素的默认行为（被载入到一个新的页面）和停止click事件的传播，如果你只是想阻止导航方面/默认行为，您可以改用：

$('#next').click(function(e){ 
    e.preventDefault(); 
    $('.button').css('height','1200'); 
});

JS Fiddle demo。

对于这个特定的锚点，最糟糕的情况是用户将被带回到页面的顶部，因为'href'只是'#'。尽管如此，调用'preventDefault（）'仍然是一个好主意，所以它们不会感到恼火。 – 2012-02-01 13:34:47

答

早安，

看起来好像你的下一个ID不正确命名的（除非我失去了一些东西）。

在你的榜样，你有下面这行：

<input type="button" id="btnNext" value="Next" class="button"/>

此基础上，你的jQuery的需要是：

$(document).ready(function(){ 
    $('#btnNext').click(function(){ 
     $('.button').css('height','1200'); 
    }); 
});

让我知道，如果不工作！

JMax

'next'是2个按钮旁边的锚的ID！ – Jamiec 2012-02-01 13:26:33

杜。谢谢。不能相信我错过了那个;）。 – 2012-02-01 13:28:25

答

这和后期的错误你似乎并没有包含对jQuery库的引用。

一下添加到头部（假设jQuery是在同一文件夹）：

<script type="text/javascript" src="jquery.js" ></script>

更改jQuery中按钮的高度，使用.css不起作用

相关推荐