Javascript没有输入带.php文件引用的函数

Question

long time answer-seeker, first time question-asker.

I am configuring a small snippet of js which is referenced in the page footer:

<script type='text/javascript' src='http://test.site.com/wp-content/themes/spacious/js/jsfile.js?ver=1.0.5'></script>

Here is the html for the inputs:

<div>
    <form id="search" action="" method="POST">
        <input type="text" id="str" name="str" value="" />
        <input type="submit" value="search" />
    </form>
    <div id="search_results"></div>
</div>

js script file as follows:

(function func() {
    $("#search").bind('submit', function () {
        var value = $('#str').val();

        $.post('db_query.php', {
            value: value
        }, function (data) {
            $("#search_results").html(data);
        }); 

        return false;
    });
});

php file as follows:

<?php
    try {
        $db = new PDO('sqlsrv:Server=xx.xx.xx.xx;Database=xxxx','user','pass');
    }
    catch (Exception $e) {
        echo 'PDO connection error: ' . $e->getMessage();
        exit(1);
    }

    $sql=$db->prepare("SELECT top 20 Timestamp,Information,Location FROM Table WHERE JobReference = :val");
    $sql->execute(array(':val'=>$_REQUEST['value']));

    echo '<table>';
    echo '<th>Date Time</th><th>Information</th><th>Location</th>';

    while ($row=$sql->fetch())
    {
        echo "<tr><td>$row[Timestamp]</td><td>$row[Information]</td><td>$row[Location]</td></tr>";
    }
    echo '</table>';
?>

When I try to use Chrome to debug, it stops on the first '(' and then jumps to the end of the function. At first I thought it was because of the .php file reference, but it seems like it is not even hitting it?

I don't know where to go with this...

Many thanks, Cameron.

Answer 1

In addition to @Nano answer, you can fix like this:

(function($) { //pass $ as jQuery in this scope
$("#search").bind('submit', function () {
    var value = $('#str').val();
    $.post('db_query.php', {
        value: value
    }, function (data) {
        $("#search_results").html(data);
    }); return false;
  });
})(jQuery); //$ is jQuery