获取文本框文本使用ajax按钮单击

Get the textbox Text using ajax on button click

本文关键字：ajax 按钮 单击 取文本 文本 获取      更新时间：2023-09-26

我想要一个代码获取文本框值时，提交按钮被点击。一定是Ajax。这是我到目前为止尝试的代码。但是我不能去工作....

<form action="" method="post">
<p>Route No :
<input type="text" name="route_no" required="required" />
<input type="submit" value="Search" name="search" />
</form>
Ajax代码

<script type="text/javascript">
$(document).ready(function() {
$("#sub").click(function() {
var textboxvalue = $('name or id of textfield').val();
$.ajax({
    type: "POST",
    url: 'ajaxPage.php',
    data: {txt1: textboxvalue},
    success: function(result) {
        $("div").html(result);
    }
});
});
});​
</script>
PHP代码

$txt = null;
if((isset($_POST)) && (isset($_POST['txt1'])))
{
echo $txt = $_POST['txt1'];
}

HTML:

<label for="route_no">Route No:</label><input type="text" id="route_no" name="route_no" required="required" />
<input type="button" value="Search" id="search" />
<div id="result"></div>
JavaScript: 

$(document).ready(function()
{
    $("#search").click(function()
    {
        var textboxvalue = $('input[name="route_no"]').val();
        $.ajax(
        {
            type: "POST",
            url: 'ajaxPage.php',
            data: {txt1: textboxvalue},
            success: function(result)
            {
                $("#result").html(result);
            }
        });
    });
});​

ajaxPage.php: 

if(isset($_POST) && isset($_POST['txt1']))
{
    echo $_POST['txt1'];
}

这里有问题

$("#sub").click(function() {

你正在使用id="sub"作为提交按钮，但你没有为该按钮分配id，所以给提交按钮id为id="sub"

要获取文本框的值，可以使用:

$('#elementid').val()
相关文章：