时间戳

首页 > 解决方案 > 不能两次更改元素的类型？

javascript - 不能两次更改元素的类型？

问题描述

我依赖于另一个插件 javascript，它具有特定提交事件的代码，该事件在经过一些验证后提交表单。

如果不侵入该代码，我将无法更改该验证。

因此，我想出了一个没有破解插件代码的破解方法。我正在将输入类型从提交更改为按钮类型，这样我就可以进行自己的验证，而不必考虑提交时触发的操作。

有两个带有 class 的单选按钮.give-gateway。基本上我正在这样做。

HTML（表单中的元素）：

<input type="submit" class="give-submit give-btn" id="give-purchase-button" 
name="give-purchase" value="Donate Now" data-before-validation-label="Donate 
Now">

jQuery：

$('body').on('click', '.give-gateway', check_gateway);

function check_gateway(id) {

        //Value from which radiobutton is selected
        if (current_gateway == 'swish') {
            alert('changing button from ORIGINAL to new. NOW IT SHOULD BE 
            TYPE BUTTON!!!'); 
            $('#give-purchase-button').prop('id', 'give-purchase-button- 
            new').prop('type','button');
            $('body').on('click touchend', '#give-purchase-button-new', function 
            (e) {
                alert('NEW give purchase button clicked');
                //some code...

            });

        }
        else {
            alert('changing button from NEW to original. NOW IT SHOULD BE TYPE 
            SUBMIT!!!');           
            $('#give-purchase-button-new').attr('id', 'give-purchase- 
            button').prop('type','submit'); 
        }
    }

这是第一次工作：

  1. 从提交到按钮

  2. 从按钮到提交

  3. 从提交到按钮

第 3 步（不工作（第一次点击 swish 网关工作，但第二次没有从提交更改为按钮）！？**为什么？）**

我还尝试以编程方式将 onsubmit 添加到表单，但问题是其他插件 jquery 代码在实际提交按钮上有一个单击事件的侦听器，这意味着无论如何都会首先执行该代码。我不希望这种情况发生。

我现在知道为什么了。当我单击另一个网关时，表单会加载其他内容。当我从 swish 转到 paypal 时。它加载依赖于贝宝的内容并创建一个新的提交按钮。如果我只是从提交类型更改为按钮，它不会影响任何内容，因为该更改是在加载实际内容之前进行的（通过 ajax），因此会创建一个新的提交按钮。

标签： javascriptjquery

解决方案

推荐阅读