关于form表单button事件教训

在form中我自定义了一个button,然后在button上增加了点击事件。html代码大致如下：

<form t-att-action="keep('/shop/order/preview')" class="js_add_cart_variants" method="POST">
                                            
         <div class="epic_download_images" t-if="inner_product">
                    <button ng-click="download_images()">
                          <span>下载图片</span>
                    </button>
         </div>
                                                   
</form>

</pre><pre name="code" class="html">button自定义事件处理逻辑如下:

$scope.download_images = function () {
        console.log(3333);
        // 创建一个 form
        var form1 = document.createElement("form");
        form1.id = "download_images_form";
        form1.name = "download_images_form";

        // 添加到 body 中
        document.body.appendChild(form1);
        console.log(document.getElementById('download_images_form'));

        // 创建一个输入
        var input = document.createElement("input");
        // 设置相应参数
        input.type = "text";
        input.name = "product_tmpl_id";
        input.value = $scope.product_template_id;

        // 将该输入框插入到 form 中
        form1.appendChild(input);

        // form 的提交方式
        form1.method = "POST";
        // form 提交路径
        <span style="color:#ff0000;"><strong>form1.action = "/export/tmpl_images";</strong></span>

        // 对该 form 执行提交
        form1.submit();
        // 删除该 form
        // document.body.removeChild(form1);
    };

button的主要目的是重新创建一个form表单，然后点击后跳转到 /export/tmpl_images 页面，但是很奇怪，点击后一直跳转到 它所在的form 的 action /shop/order/preview  

寻思了很久，后来恍然大悟，form中的 <input type="button"> 和<button></button> 都会点击后跳转到它所在的form的action执行的页面。

为了解决这个跳转问题，让页面跳转到button中用js制定的url，需要在form中增加  onSubmit = "return false;"

或者为了不影响原来form的跳转，将button或<input type="button">标签 换成其它标签。