Question

我有一个HTML表单，我想使用链接提交它。表单必须发送到链接的href。这是我的想法：

将点击事件设置为链接tag，其中执行以下操作：

阻止关注链接的默认操作。
通过将操作设置为链接的href来编辑表单。
使用jquery submit（）函数提交表单。

我正在寻找一个解决方案，我不必更改我的HTML，只有javascript。

我试过这个，但它没有用。这是我的代码：

使用Javascript：

jQuery('.row_header').find('td').each(function(){
    var cell = jQuery(this);
    cell.find('a').each(function(){
        //Get last link in cell. There is only one
        linkObject = jQuery(this);
    });     

    //Gets form
    var form = jQuery('#searchForm');

    if(typeof linkObject !== 'undefined'){
        //Get location url for form
        var url = linkObject.attr('href');

        linkObject.click(function(e){
            //Prevent default (following link)
            e.preventDefault(); 
            //Set location from link as form action     
            form.attr('action',url);
            //Submits form
            form.submit();

        });
    }
});

HTML：

<form id="searchForm">
    <input type="text" name="myInput" value="myValue">
    <input type="submit" name="mySubmit" value="mySubmitValue">
</form>

<table>
    <tr class="row_header"><td><a href="myLocation.php">The Link </a></td></tr>
</table>

Answer 1

如果您想点击表单的action 链接的href ，请尝试以下内容：

 $( "#myLink" ).click(function() {
   var form =  $( "#searchForm" ); 
   form.action=$(this).attr('href');
   console.log(form.action);
   form.submit();
 });

这是working Fiddle。

Answer 2

您会看到您的链接对象定义在哪里。 linkObject (内有)。

你定义了这个变量吗？

您已使用a元素将您带到链接。因此，您必须使用以data-开头的属性，并使其看起来像data-href1=' your link'并将attribut href设置为#。

您的a元素应如下所示：

<a href='#' data-href1 ='your link'> click </a>

Answer 3

一种选择是将表单提交按钮设置为链接样式。你可以在这里看到：

How to make button look like a link?

或者让链接使用javascript来提交表单。像这里：

Use a normal link to submit a form

两者都可以满足您的需求。

Answer 4

JQuery submit函数将处理程序绑定到submit事件。

您可以使用AJAX，例如发送数据

Answer 5

我找到了解决方案。我仍然不知道为什么，但由于某种原因.submit（）不会调用submit函数。我的解决方法是找到提交按钮并触发点击：

form.find('#submitId').trigger('click');

代替

form.submit()

并且

 <input type="submit" name="mySubmit" id="submitId" value="mySubmitValue">

代替

 <input type="submit" name="mySubmit" value="mySubmitValue">

不需要编辑html，但是你必须编辑find（）函数来查找名称或类型的提交。我在寻找结果的同时也改变了我的代码。这是最终的JS：

jQuery(function(){
    jQuery('.row_header').find('td').each(function(){

        var linkObject = jQuery(this).find('a');

        if(typeof linkObject !== 'undefined'){

            linkObject.click(function(e){
                //Prevent following the link
                e.preventDefault();
                //Get url
                var url = jQuery(this).attr('href');     
                //Get form              
                var form = jQuery('#searchForm');
                //Change form action
                form.action = jQuery(this).attr('href');
                //Click submit button
                form.find('#submitId').trigger('click');
            });
        }
    });
});

点击链接后发送表格

5 个答案: