单击其他图像时隐藏图像 [英] Hide Image when another image is clicked

查看:93
本文介绍了单击其他图像时隐藏图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这似乎很简单..但是我对jquery有点不满意,也许我在做一些愚蠢的错误?

this seems to be simple.. but I am a bit noobish with jquery, maybe I am doing something silly wrong?

我要单击一个图像,然后单击该图像,将其旁边的另一个图像隐藏起来.

I want to click an image, and on that click, hide another image right next to it.

 <script type="text/javascript"> 


        $("#butShowMeSomeUnits").click(function() { 
            $('#arrowUnitspic').hide();
        });


 </script>

根据两个图像,

Id是正确的.我想念什么?对其进行调试,代码永远不会被触发...

Id's are correct as per the two images. What am I missing? Debugging it, the code never gets fired...

谢谢

我将我的控件作为ASP母版页上的嵌套控件,并且其ID被重写.现在,我已经修复了ID,但是仍然无法获得任何乐趣……我还看到我的标记被呈现为输入",这会有所作为吗?

I had my control as a nested control on an asp masterpage, and its id was being rewritten. I have now fixed the id, but I still cant get any joy... I also see my markup is being rendered as an "input", would that make a difference?

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

    <script type="text/javascript">
        $(document).ready(function () {
            $("#butShowMeSomeUnits").click(function () {
                $('#arrowUnitspic').hide();
            });
        });

</script>
</head>

<body>
<input type="image" src="bookings_media/buttons/show-me-some-units.png" onmouseout="this.src='bookings_media/buttons/show-me-some-units.png'" onmouseover="this.src='bookings_media/buttons/show-me-some-units_orange.png'" id="butShowMeSomeUnits" name="ctl00$ctl00$ContentPlaceHolder1$bookings_right_content$butShowMeSomeUnits">
</body>

编辑 JS小提琴

如果有任何混淆...我用正确的代码假脱的JS小提琴也无法正常工作...

If there is any confusion... the JS fiddle I spooled up with the exact code also does not work...

推荐答案

您需要在页面准备就绪时进行操作:

You need to do do on page ready:

<script type="text/javascript"> 
$(document).ready(function() {
       $("#butShowMeSomeUnits").click(function() { 
            $('#arrowUnitspic').hide();
        });
});
</script>

您提供的小提琴在我从下拉列表中选择jQuery 1.10.1之前不起作用.您会注意到onmouseover首先会更改元素,但是一旦您单击输入,它就会隐藏图像.您可以验证这是否对您有用吗?

The fiddle you provided did not work until I chose jQuery 1.10.1 from the dropdown. You will notice your onmouseover changes the element first, but once you click on the input it does hide the image. Can you verify this works the same for you?

如果答案是否定的,那么我认为您没有在页面上加载jQuery库.要检查此方法是否可以工作:

If the answer is no then I don't think you are loading the jQuery library on your page. To check this should work:

if (typeof jQuery != 'undefined') {

    alert("jQuery library is loaded!");

}else{

    alert("jQuery library is not found!");

}

另外,查看您的浏览器控制台/dev工具显示哪些错误也可能会有所帮助.

In addition it might be helpful to see what errors your browser console /dev tools is showing.

这篇关于单击其他图像时隐藏图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆