javascript - JavaScriptを使用して入力送信要素をボタン要素に変換する方法は?

Question

<input type="submit">ボタンを、<button>ID、クラス、イベント、タブインデックスなどすべてとともに要素に変換しようとしています。

良いアプローチのアイデアはありますか？jQuery もオプションです。

注:<input type="submit">元のhtml コードにアクセスできません。

Answer 1

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

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

デモ

Answer 2

すべての属性を取得し、元の要素をボタン要素に置き換えることは有効な解決策です。新しい要素に不要な属性については、"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>

フィドルを作成しました