Question

我正在尝试将<input type="submit">按钮转换为<button>元素及其所有ID，类，事件，tabindex等。

对好方法有什么看法吗？ jQuery也是一种选择。

注意：我无法访问原始的<input type="submit"> html代码。

Answer 1

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

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

DEMO

Answer 2

这是一个工作解决方案，用于获取所有属性并使用button元素替换原始元素。对于新元素不需要的属性，可以在“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

如何使用JavaScript将输入提交元素转换为按钮元素？

2 个答案: