單擊其他圖像時隱藏圖像

Question

這似乎很簡單..但是我對jquery有點不滿意，也許我在做一些愚蠢的錯誤？

我要單擊一個圖像，然后單擊該圖像，在它旁邊隱藏另一個圖像。

 <script type="text/javascript"> 


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


 </script>

根據兩張圖片ID正確。 我想念什么？ 調試它，代碼永遠不會被觸發...

謝謝

編輯

我將我的控件作為ASP母版頁上的嵌套控件使用，其ID被重寫。 我現在已經固定了ID，但仍然無法獲得任何樂趣...我還看到我的標記被呈現為“輸入”，這會有所作為嗎？

 <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小提琴也不起作用...

Answer 1

您需要做好頁面准備：

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

編輯：在我從下拉列表中選擇jQuery 1.10.1之前，您提供的小提琴不起作用。 您會注意到onmouseover首先會更改元素，但是一旦您單擊輸入，它就會隱藏圖像。 您可以驗證這是否對您有用嗎？

如果答案是否定的，那么我不認為您正在頁面上加載jQuery庫。 要檢查這應該工作：

if (typeof jQuery != 'undefined') {

    alert("jQuery library is loaded!");

}else{

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

}

另外，查看您的瀏覽器控制台/ dev工具顯示了哪些錯誤可能會有所幫助。

Answer 2

將代碼包裝在jQuery.ready（）事件中。 還要檢查是否已加載jquery js文件。

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

Answer 3

您的代碼看起來不錯，可以在這里檢查

您可能會錯過的是：

將jQuery腳本加載到頁面頂部。
包括$(document).ready(function() { //code here }); 如果您的<img>標記在頁面代碼中的腳本之后。 這樣一來，當頁面准備就緒/已加載時，您的代碼就會加載。

Answer 4

可能會幫助您的步驟：

確保您正確集成了jQuery lib。 （以檢查您是否想在chrome上打開控制台並鍵入$("html").hide();並查看當前頁面是否消失）
確保您的自定義JS文件或代碼在jQuery lib的包含之下。
jQuery的一個很好的起點是將所有內容都放入$(document).ready() ，如下例所示：
$（document）.ready（function（）{$（“ img”）。click（function（）{$（“ img”）。hide（）; $（this）.show（）;}）;}）;

單擊其他圖像時隱藏圖像

問題描述

4 個解決方案

解決方案1
2 2013-07-17 17:56:42

解決方案2
1 2013-07-17 17:57:51

解決方案3
0 2013-07-17 17:59:59

解決方案4
0 2013-07-17 18:09:47

單擊其他圖像時隱藏圖像

問題描述

4 個解決方案

解決方案1 2 2013-07-17 17:56:42

解決方案2 1 2013-07-17 17:57:51

解決方案3 0 2013-07-17 17:59:59

解決方案4 0 2013-07-17 18:09:47

解決方案1
2 2013-07-17 17:56:42

解決方案2
1 2013-07-17 17:57:51

解決方案3
0 2013-07-17 17:59:59

解決方案4
0 2013-07-17 18:09:47