Javascript 将提交按钮的HTML转换为链接HTML？

我有以下HTML格式的提交按钮：

<input name="submit" type="submit" value="Sign In" />

我想使用以下方法将其转换为HTML链接：

<a  href="#" onclick="document.getElementById('formname').submit()">Sign In</a>

但是表格没有提交

谢谢

完整代码如下：

<form id="form_freeuser" action="login.php" method="post" name="form_freeuser">
            <div class="label"><label>Free User</label></div><input id="name" name="name" readonly="readonly" type="text" value="test" />
            <input id="user_email" name="email" readonly="readonly" type="password" value="test" />
            <input name="submit" type="submit" value="Sign In" />

        </form>

自由用户

使用

Jquery

可以按如下方式执行

$(document).ready(function(){
    $('a').click(function(e){
        $('form').submit();
    });
});

---

确保将

id

属性设置为发送到

getElementById（）

的任何对象

​

这将修复您的代码，这是您要问的问题。不过，作为一个要点，我不建议使用链接来提交表单。用户希望按钮提交表单，而不是链接。不要像这样弄乱语义。你会让用户感到困惑和烦恼

---

您还可以使用CSS将按钮样式设置为超链接。它有着与打破惯例完全相同的问题。

通过点击链接，你的浏览器会试图将你从页面中带走，因此你会丢失所有数据。你可以：

<a  href="#" onclick="document.getElementById('formname').submit();return false">Sign In</a>

同样

在这篇文章中：
@odedbd提供了一个很好的解决方案：

他的代码将一个按钮变成一个外观正常的超链接。
与JS解决方案相比的好处是，您不使用JS。因此，禁用JS的用户仍然可以使用您的表单。这似乎是一种更优雅、更符合HTML的方法

我复制了下面的代码，以防链接断开：

<button> your button that looks like a link</button>

button {
    background:none!important;
     border:none; 
     padding:0!important;

    /*optional*/
    font-family:arial,sans-serif; /*input has OS specific font-family*/
     color:#069;
     cursor:pointer;
}
button:hover{
         text-decoration:underline;
}

看起来像链接的按钮
钮扣{
背景：无！重要；
边界：无；
填充：0！重要；
/*可选的*/
字体系列：arial，无衬线；/*输入具有特定于操作系统的字体系列*/
颜色：#069；
光标：指针；
}
按钮：悬停{
文字装饰：下划线；
}

此外，您不希望-all-submit按钮具有这种样式。因此，我建议这样做：

<input type="submit" class="submit_hyperlink" value="submit this form"/>

input.submit_hyperlink {
    background:none!important;
     border:none; 
     padding:0!important;

    /*optional*/
    font-family:arial,sans-serif; /*input has OS specific font-family*/
     color:#069;
     cursor:pointer;
}

input.submit_hyperlink:hover{
         text-decoration:underline;
}

input.submit\u超链接{
背景：无！重要；
边界：无；
填充：0！重要；
/*可选的*/
字体系列：arial，无衬线；/*输入具有特定于操作系统的字体系列*/
颜色：#069；
光标：指针；
}
输入。提交超链接：悬停{
文字装饰：下划线；
}

您的标签中有吗？为什么要这样做？JS方法不适用于禁用JS的用户。。另一方面，你可以随心所欲地设置输入的样式——即使是模仿

，你也可能不想使用链接。你可以使用一个span标签，并按照你想要的方式来设计它。请问我该怎么做？谢谢。最好不要用JavaScript来做这件事。看看我的新答案。最初的海报问题不是“做这件事的最佳方式是什么？”而是（意译）“这是我的代码，为什么它不做我期望它做的事情？”这回答了这个问题。没错。但是对于出于某种原因不需要显式使用JS方法的人来说，HTML方法提供了更多的好处。这不是明确的要求，而是隐含的要求。这两个答案都很有用，取决于目的。如果您愿意，可以将它们组合成一个答案。

<form name="formname">

document.formname

<button> your button that looks like a link</button>

button {
    background:none!important;
     border:none; 
     padding:0!important;

    /*optional*/
    font-family:arial,sans-serif; /*input has OS specific font-family*/
     color:#069;
     cursor:pointer;
}
button:hover{
         text-decoration:underline;
}

<input type="submit" class="submit_hyperlink" value="submit this form"/>

input.submit_hyperlink {
    background:none!important;
     border:none; 
     padding:0!important;

    /*optional*/
    font-family:arial,sans-serif; /*input has OS specific font-family*/
     color:#069;
     cursor:pointer;
}

input.submit_hyperlink:hover{
         text-decoration:underline;
}