按鈕的onclick不止一次，在javascript

Question

不同的文本所以我做了這個按鈕，我從

{description} 

以「不......」點擊後作出的說明文字變化。這是我做了什麼：

function changeText(txt){ 
    document.getElementById('name').innerHTML = txt; 
} 

<p> 
    <b id='name'>{description}</b>. 
</p> 
<input type='image' 
    onclick='changeText("No...")' 
    src='http://i.imgur.com/4y6bzH9.png' 
    style="margin-left: 540px; margin-bottom: 20px; position: absolute; outline: none;"/> 

如果你願意，你可以查看我的所作所爲對/ http://yosougay.tumblr.com/

我試圖使說明文字後點擊另外一個時間上的變化的另一個時間同樣的按鈕，所以我嘗試添加另一個onClick，以便在下次單擊按鈕時將描述文本更改爲「其他文本」。

function changeText(txt){ 
    document.getElementById('name').innerHTML = txt; 
} 

<p> 
    <b id='name'>{description}</b>. 
</p> 
<input type='image' 
    onclick='changeText("No...")'; 
    onclick='changeText("Another text")';src='http://i.imgur.com/4y6bzH9.png' 
    style="margin-left: 540px; margin-bottom: 20px; position: absolute; outline: none;" /> 

我測試了它，它沒有工作。請問，是否可以製作一個JavaScript按鈕，每次點擊時都會將文本更改爲不同的文本？

到目前爲止，我只能夠在兩個使文本變化一次。

Answer 1

嘗試這樣：http://jsfiddle.net/54pp2/2/

<input id="click" type="button" value="click" /> 
<label id="test">Test</label> 


$(document).ready(function() { 
    var textArray = []; 
    textArray[0] = 'test 1';  
    textArray[1] = 'test 2';  
    textArray[2] = 'test 3';  
    textArray[3] = 'test 4';  

    var idx = 0; 
    $('input#click').on('click', function(){ 
     idx++; 
     var newidx = idx % textArray.length; 
     $('label#test').text(textArray[newidx]); 
    }); 
}); 

Answer 2

我想這就是你想要

<script> 
<!-- 

$(document).ready(function(){ 

    var textarray ={"No...","Another Text"}; 
    var count = 0; 
    $('input[type="image"]').click(function(){ 
     $('#name').text(textarray[count]); 
     count = count==0?1:0; 
    }); 
}); 

// --> 
</script> 
<p> <b id='name'>{description}</b>. </p> 
<input type='image' onclick='changeText("No...")' src='http://i.imgur.com/4y6bzH9.png' 
style="margin-left:540px; margin-bottom:20px; position:absolute; outline:none;"/> 
<br /><br /> 

Answer 3

你可以跟蹤多少次按鈕已經從內部的JavaScript點擊什麼。

<script> 
var clicked = 0; 
function changeText(){ 
    if (clicked == 0) { 
     document.getElementById('name').innerHTML = "No..."; 
    } 
    else if (clicked == 1) { 
     document.getElementById('name').innerHTML = "Another text"; 
    } 
    clicked++; 
} 
</script> 

請注意我是如何從changeText（）中刪除參數的。

Answer 4

當然可以。

只能綁定一個點擊監聽器的方式。複製屬性onclick將只覆蓋第一個，不提供兩個點擊監聽器。

你想要做的是「每一次不同的文本」來處理你的onclick單聽衆。

<script> 
    var txts = ["first", "second", "third"] 
    var counter = 0; 
    function changeText() { 
    document.getElementById('name').innerHTML = txts[counter%3]; 
    counter++; 
    } 
</script> 

<p> 
    <b id='name'>{description}</b>. 
</p> 
<input type='image' 
     onclick='changeText()' 
     src='http://i.imgur.com/4y6bzH9.png' 
     style="margin-left: 540px; 
       margin-bottom: 20px; 
       position: absolute; 
       outline: none;"/> 

Answer 5

Fiddle

我的建議是的onclick改變onclick='changeText()'。

存放在數組中的文本，並使用元素的計數屬性。這也將移動到第一個文本並重復，在第三次點擊。

var texts = [ 
    'No', 
    'Another text' 
]; 

function changeText(){ 
    var elem = document.getElementById('name'); 
    if(typeof elem.count == 'undefined'){ 
     elem.count = 0; 
    } else { 
     elem.count++; 
    } 

    if(elem.count == texts.length){ 
     elem.count = 0; 
    } 

    elem.innerHTML = texts[elem.count]; 
}