单击链接时jquery调整div的大小

Question

有人可以解释当有人单击链接时如何使用jquery调整div的大小。

该代码不起作用：

$(".a_link").click(function() {
    $("#insur_main").css("width","800px");
 });

Answer 1

您可能需要将语句括在$（document）.ready（）中，以确保在元素完全加载后绑定事件。

 $(document).ready(function() {
   $(".a_link").click(function() {
        $("#insur_main").css("width","800px");
    });
 });

Answer 2

您的代码应该可以工作

 $(".a_link").click(function() { $("#insur_main").css("width","800px"); }); 

 #insur_main { width:100px; height:100px; background-color:red; } 

 <div id="insur_main"> </div> <a href="#" class="a_link">Resize DIV</a> 

Answer 3

您的脚本顺序可能有问题。

请参阅jsFiddle上的示例

<script>
    alert( "Doesn't exist yet " + $(".a_link").length );
</script>

<a href="#" class="a_link">Link 01</a>
<script>
    alert( "Now it does exist " + $(".a_link").length );
</script>

<script>
$(function() {
    // ondomready it exists
    alert( "Ready " + $(".a_link").length );
});
</script>

您可能在呈现元素之前调用了脚本。 它可能在DOM上尚不存在。 输入DOM后，您必须执行脚本。