Question

我有div和按钮。 .buttons大小没有变化。

（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>

Answer 1

我认为你还没有包含jQuery库。

尝试包含此内容并从错误控制台发布错误

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

Answer 2

早上好，

看起来你的下一个id没有正确命名（除非我遗漏了什么）。

在您的示例中，您有以下行：

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

基于此，你的jQuery必须是：

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

如果这不起作用，请告诉我！

JMAX

Answer 3

您似乎没有包含对jQuery库的引用。

将此添加到head部分（假设jquery位于同一文件夹中）：

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

Answer 4

如果没有进一步的信息，我只能假设在效果发生之前正在遵循链接，以避免这种情况（并防止链接被跟踪（以及打开新页面））：

$('#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

用.css改变jQuery中按钮的高度不起作用

4 个答案: