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

Question

我想要一个代码，用于在单击提交按钮时获取文本框值。一定是 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'];
}

Answer 1

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'];
}