Question

请参阅website。

我的数据库有一个表格，其值为'name'（左边第2步下的事件），'price'，'date'等，我想在右边的暗框中动态显示它们，具体取决于选择了哪个事件。

我目前正在使用下面的代码显示事件本身，但我不确定如何开发它以根据此选择获取数据库值。我猜是某种.get（）。

<script type="text/javascript">

    $(document).ready(function() {
            $('#right_inside').html('<h2>' + $('#club').val() + '</h2>');
    });

    $('#club').change(function(event) {
        $('#right_inside').html('<h2>' + $('#club').val() + '</h2>');
    });

</script>

这让我难以忍受多年，所以任何帮助都会非常多，非常感谢！

修改

感谢您的回复。这就是我现在所拥有的，但它不起作用。

jQuery的：

<script type="text/javascript">

$(document).ready(function() {
        $('#right_inside').html('<h2>' + $('#club').val() + '</h2>');
});

$('#club').change(function(event) {
    $.ajax({
        type: "post",
        url: "eventinfo.php",
        data:  $(this).serialize(),
        success: function(data) {
            $('#right_inside').html('<h2>' + $('#club').val() + '</h2>Price'+data.price);
            },
        dataType: "json"
    });

});

</script>

eventinfo.php：

    <?php
// the name of the input text box is 'club'
    $night = $_POST['club'];
    $night = mysql_real_escape_string($night);

// one of the columns values included in * is 'price'
// this line was previously: $query = mysql_query("SELECT * FROM nights WHERE name = '$night'");
    $query = "SELECT * FROM nights WHERE name = '$night'";

        $result = mysql_query($query);
        $items = array();

        if($result && mysql_num_rows($result) > 0) { 
            while ($row = mysql_fetch_array($result)) { 
                $items[] = array($row[0]);
                }         
        } 

        mysql_close(); 
        // convert into JSON format and print
        echo json_encode($items);
    ?>

Answer 1

最好的做法是使用xmlhttp对象加载回显数据的PHP页面。从该xmlhttp对象，您可以将responseText（它将是PHP页面的输出内容）分配给Javascript变量。

换句话说，您可能想要使用AJAX。

Answer 2

如果我理解你，你想要一个AJAX电话来获得价格。像

这样的东西

$('#club').change(function(event) {
     $.ajax(
     {type: "post",
     url: "/path/to/price",
     data:  $(this).serialize(),
     success: function(data)
     {
      $('#right_inside').html('<h2>' + $('#club').val() + '</h2>Price'+data.price);
     },
    dataType: "json"
});

然后，因为您正在使用PHP获取所需的值并将它们加载到数组中并使用json_encode。

更新

对于PHP尝试更改

    if($result && mysql_num_rows($result) > 0) { 
        while ($row = mysql_fetch_array($result)) { 
            $items[] = array($row[0]);
            }         
    }

到

    if($result && mysql_num_rows($result) > 0) { 
        while ($row = mysql_fetch_array($result)) { 
            $items[] = array("price"=>$row['price']);
            }         
    }

更新＃2

尝试将以下内容添加到靠近顶部的PHP文件中：

header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');

Answer 3

这是使用客户端模板的好地方。使用jQuery.tmpl并为右侧制作模板（下面的示例）：

<script id="infoTemplate" type="text/html">
    <div>
        <span>${price}</span>
        <span>${information}</span>
    </div>
</script>

然后，在PHP中创建一个类似于eventId的方法并传回一个类似于这样的JSON对象：{“price”：“123.34”，“information”：“some info here”}。要加载模板，请执行以下操作：

$(document).ready(function(){
    // ... other stuff

    $.template("infoTemplate", $("#infoTemplate").html());
});

然后，在您的更改事件处理程序中，执行以下操作：

$('#club').change(function(event) {
    $.get('/yourNewPHPMethod', $('#club').val(), function(data){
        $('#right_inside').html($.tmpl('infoTemplate', data));
    });
});

很抱歉，没有时间测试这些，但这是主要的想法，应该可以帮助您为将来的任何此类工作建立良好的模式。请参阅下面的jQuery.tmpl文档： http://api.jquery.com/jquery.tmpl/

根据下拉列表，使用数据库值动态更新div

3 个答案:

更新

更新＃2