如何使用Anchor标签作为提交按钮

如何使用Anchor标签作为提交按钮

HTML中<a>的anchor tag是用来在网页上创建一个超链接。这个超链接用于将网页链接到其他网页上。它既可以用来提供一个绝对引用,也可以提供一个相对引用作为其” href”值。

语法:

<a href = "link"> Link Name </a>

href属性指定了链接所指向的页面的URL。如果href属性不存在,该<a>标签将不是一个超链接。你可以使用href="#top"href="#"来链接到当前页面的顶部。

要使用锚定标签作为提交按钮,我们需要JavaScript的帮助。在提交表单时,我们使用JavaScript .submit() 函数。这个函数可以提交表单。

语法:

document.getElementById("GFG").submit();

注意: “GFG “是表格元素中提到的 “id”。

示例 1:

<!DOCTYPE html>
<html>
    <body>
        <h2>Use Anchor tag as Submit button</h2>
        <form id="GFG" action="submit.php" method="POST">
            Username
            <br />
            <input type="text" name="UserName" id="UserName" />
            <br />
            Password
            <br />
            <input type="password" name="Password" id="Password" />
            <br />
            <a href="#" onclick="myFunction()">
              Click here to submit form
            </a>
        </form>
  
        <script>
            function myFunction() {
                document.getElementById("GFG").submit();
            }
        </script>
    </body>
</html>

输出:
如何使用Anchor标签作为提交按钮?

注意:我们也可以调用.submit() 函数,通过将JavaScript写成

<a href="javascript:$('GFG').submit();" >Click here to submit form</a>

示例 2:

HTML 代码:

<!DOCTYPE html>
<html>
    <body>
        <h1>Use Anchor tag as Submit button</h1>
        <form id="GFG" action="submit.php" method="POST">
            Username
            <br />
            <input type="text" name="UserName" id="UserName" />
            <br />
            Password
            <br />
            <input type="password" name="Password" id="Password" />
            <br />
  
            <a href="javascript:$('GFG').submit();">
              Click here to submit form
            </a>
        </form>
    </body>
</html>

输出:

如何使用Anchor标签作为提交按钮?

anchor tag

PHP代码:下面的代码是上述HTML代码中使用的 “submit.php “的内容。我们必须添加一些PHP代码来发送数据到数据库(使用本地服务器XAMPP来测试以下代码)。

<?php
servername = "localhost";username = "root";
password = "";dbname = "student";
  
// Create connection
conn = mysqli_connect(servername, username,password, dbname);
// Check connection
if (!conn) {
  die("Connection failed: " . mysqli_connect_error());
}
name=_POST['UserName'];
pwd=_POST['Password'];
  
sql = "INSERT INTO student (firstname, password) VALUES ('name','pwd')";
  
if (mysqli_query(conn, sql)) {
  echo "New record created successfully";
} else {
  echo "Error: " .sql . "<br>" . mysqli_error(conn);
}
  
mysqli_close(conn);
?>

输出:

  • 现在,在表格中添加一些数据。假设用户名是’Akshit’,密码是’123’。

如何使用Anchor标签作为提交按钮?

  • 现在点击超链接“点击这里提交表格“。

如何使用Anchor标签作为提交按钮?

  • 让我们看一下‘学生’数据库。

如何使用Anchor标签作为提交按钮?

Data table

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程

jQuery 方法