如何讓圖像在javascript中可點擊？

我最近在使用此代碼的博客上設置了自定義旋轉橫幅，但我似乎無法弄清楚如何使圖片可點擊鏈接到主頁。任何幫助將不勝感激。如何讓圖像在javascript中可點擊？

繼承人的代碼：

<script type='text/javascript'> 
var HeaderImage= new Array() 

HeaderImage[0]=&quot;http://Example1.png&quot; 
HeaderImage[1]=&quot;http://Example2.png&quot; 
HeaderImage[2]=&quot;http://Example3.png&quot; 
HeaderImage[3]=&quot;http://Example4.png&quot; 
HeaderImage[4]=&quot;http://Example5.gif&quot; 
HeaderImage[5]=&quot;http://Example6.png&quot; 
HeaderImage[6]=&quot;http://Example7.png&quot; 
var random=Math.round(6*Math.random()); 

document.write(&quot;<style>&quot;); 
document.write(&quot;#header {&quot;); 
document.write(&#39; background:url(&quot;&#39; + HeaderImage[random] + &#39;&quot;) no-repeat left TOP;&#39;); 
document.write(&quot; }&quot;); 
document.write(&quot;</style>&quot;); 

</script>

它現在的工作傢伙。我只是不確定在哪裏把每個人都貼在我身上的標籤。非常感謝您的幫助。

來源

2012-02-15 Am4d

此代碼後有&quot而不是"問題。但除此之外，這段代碼正在爲id="header"設置一個對象的背景圖像。爲了使該對象可點擊，您可以使用<a>標記圍繞標題對象。例如，如果標題對象是一個div，那麼你可以使用這樣的事情：

<a href="xxx"><div id="header"></a></a>

如果有一些原因，你不想使用鏈接，使區域點擊（這是最簡單的辦法做到這一點），那麼你也可以使用JavaScript這樣的：

document.getElementById("header").onclick = function() { 
    window.location = "http://my.example.com"; 
}

這要麼被放置在頁面HTML（所以這段代碼運行時所討論的對象已經加載的）。

如果您向我們展示包含標題對象的實際HTML，我們可以更具體地說明如何使其可點擊。

從審覈您的HTML，如果你想使它點擊只用你的HTML，你可以改變你的HTML的這一部分：

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'> 
<b:widget id='Header1' locked='true' title='Mum4d.com (Header)' type='Header'/> 
</b:section>

這個（這只是一個<a>標籤圍繞它：

<a href="http://my.example.com"> 
    <b:section class='header' id='header' maxwidgets='2' showaddelement='yes'> 
     <b:widget id='Header1' locked='true' title='Mum4d.com (Header)' type='Header'/> 
    </b:section> 
</a>

來源

2012-02-15 01:51:45 jfriend00

+1，以正確使用onclick。這是用JavaScript完全單擊元素的正確方法（在我看來）。 – tjarratt 2012-02-15 02:01:32

好吧繼承人是一大堆代碼的朋友，如果這有助於http://friendpaste.com/tZfS73SewT0b2iQUfgpsR – Am4d 2012-02-15 02:07:20

這就像一個魅力。非常感謝。對不起，讓你爲我拼出來。我是一個總noob – Am4d 2012-02-15 02:27:13

那麼，你實際上沒有任何圖像元素，所以這是你的第一個問題。

最簡單的解決方案（使圖像可點擊）將href屬性設置爲索引的錨標記中的圖像。看起來你實際上在做的是動態地爲id #header的元素編寫一些css，並將其背景設置爲圖像。當你這樣做時，沒有實際的img元素，所以除了元素本身之外，沒有什麼東西可以讓用戶點擊。

沒有看到任何更多的標記，我建議只是包裝一下你的#header元素在錨這樣<a href='/'><some_element id='header'></some_element></a>

來源

2012-02-15 01:49:27 tjarratt

缺少一個右尖括號？ – AffineMesh 2012-02-15 01:59:41

謝謝，這是我得到的減價個月後寫裸標記。 – tjarratt 2012-02-15 02:00:30

你並不需要一個''標籤有一些點擊。 – jfriend00 2012-02-15 02:38:18

-1

IDK博客是如何工作的，所以我就告訴你快速和骯髒的方式來讓它使用JavaScript。

將這個你給我們的代碼後，即使關閉腳本標籤

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script> 
$(function() { 
    $('#header').click(function() { 
     window.location = '/'; 
    }); 
}); 
</script>

來源

2012-02-15 01:50:19

包括jQuery和安裝全局點擊處理程序，只需點擊一個元素將您帶到首頁？恥辱。這甚至不需要用javascript來解決。這是矯枉過正。 – tjarratt 2012-02-15 01:53:28

它確實是，但我假設他是一個noob，並不會知道如何將元素包裝在標記中。所以我只是提供一個快速簡單的noob解決方案。 – 2012-02-15 01:56:25

如何讓圖像在javascript中可點擊？

回答

相關問題