如何使用JavaScript將輸入提交元素轉換爲按鈕元素？

我想一個<input type="submit">按鈕轉換爲<button>元素與一直以來它的ID，等級，事件的tabindex等如何使用JavaScript將輸入提交元素轉換爲按鈕元素？

在一個很好的方法你知道嗎？ jQuery也是一個選項。

說明：我沒有訪問原始<input type="submit">的html代碼。

2013-09-29 hitautodestruct

可能重複（http://stackoverflow.com/questions/6728409/change-node-type） – mechanicalfish

@hitautodestruct如果您沒有訪問你需要手動完成所有工作，或者你的解釋有點不清楚 – Bernhard

爲什麼？爲了防止表單提交？如果是的話，有更好的方法來做到這一點。 – undefined

var input = document.yourWayOfSelectingIt('maybeAnID'); 

input.outerHTML = input.outerHTML.replace(/^\<input/, '<button') + input.value + '</button>';

DEMO

來源

2013-09-29 14:15:43

其餘的屬性呢？ id，tabindex，類，事件？ – hitautodestruct

它使用正則表達式用'替換'

在jQuery中，您可以使用'.data（'events'）'獲取事件，但是我聽說範圍有問題。你也可以使用'.clone（true）'來創建新的元素，但這會讓你回到方形1，因爲你仍然需要改變tagName。 –

這是一個有效的解決方案來獲取所有屬性和替換按鈕元件的原始元素。對於新元素不需要的屬性，可以在「this.specified」條件之後放置一個條件。

<form action="test.php" action="post"> 
     <input id="submit" type="submit" /> 
    </form> 


    <script> 
     var oSubmitButton = $('input[type="submit"]'); 
     var oForm = oSubmitButton.closest('form'); 
     var sOriginAttrs = ''; 

     $.each(oSubmitButton[0].attributes, function() { 
      if (this.specified) { 
       sOriginAttrs += ' ' + this.name + '="' + this.value + '"'; 
      } 
     }); 

     oSubmitButton.replaceWith($('<button ' + sOriginAttrs + '>').text('Submit').click(function(event) { 
      event.preventDefault(); 

      //Maybe a form submit 
      //oForm.submit(); 
     })); 
    </script>

創建[更改節點類型]的Fiddle

來源

2013-09-29 15:35:01 Bernhard

如何使用JavaScript將輸入提交元素轉換爲按鈕元素？

回答

相關問題