只有在签入复选框时才应运行Jquery

时间:2012-02-24 06:33:56

标签: jquery

enter code here我的要求是我在页面上有图像和复选框。现在选中复选框时,当我将鼠标悬停在图像上时,应该运行jquery。

勾选复选框并且鼠标悬停在图像上时,jquery不应该运行....

我的代码是这样的..

$(document).ready(
 function()
    {
     $("#box img").click(
            function()
                {

                    var sr=$(this).attr("src");                    
                    //alert(sr);
                    $("#box2 img").fadeOut("slow",function(){
                    $("#box2").html("<img src='"+sr+"' style='opacity:0.30'/>");
                    $("#box2 img").fadeTo("slow",1);
                    });


                }
        );
        $("#box img").hover(
            function()
            {
                $(this).css({'z-index' : '10','border':'4px solid white'});
                $(this).animate({
                marginTop: '-110px',
            marginLeft: '-110px',
            top: '50%',
            left: '50%',
            width: '200px',
            height: '200px'        
            },200);
            },

现在我只有在选中复选框时才需要运行此功能...

4 个答案:

答案 0 :(得分:1)

我想你只想在特定情况下执行一些javascript代码(使用jquery),对吗?

因此假设您有id="check"的复选框和id="pix"

的图片

你必须把它放在你的文件准备部分:

$('#pix').mouseover(function(){
  if($('#check').is(':checked')){
    //your code is here or function call
  }
});

答案 1 :(得分:1)

我认为你想要的是:

$('#image').hover(function () {
if ($('#checkbox').is(':checked')) {
    //Your code to do what ever you want on entry
}
}, function () {
if ($('#checkbox').is(':checked')) {
    //Your code to do what ever you want on exit
}
});

答案 2 :(得分:0)

$('#image_1').mouseover(function() {
  if ($('#checkbox_1').is(':checked').length == 1)
  {
     // do stuff
  } 
});

答案 3 :(得分:0)

假设你有类似的东西:


<input type="checkbox" id="chk_1" name="chkbox[]" value="" />
<img id="img_1" src="some_image.jpg" />

<script type="text/javascript">
$(document).ready(function() {
  $("img[id^='img_']").mouseover(function() {
      var id = $(this).split("_")[1];
      if($("input[id='chk_"+id+"']").is(":checked")) {
          //run something
      }
  });
});
</script>