Question

我正在使用选择框导航到新页面，但是将根据选择框从其他数据接收表格div数据。这是我的代码

html page

<select id="works" class="btn btn-default" style="text-align:left; background-color:#FFF" onchange="getboq(this)">
<option value=""> Select Work Name</option>
<option value="1" style="text-align:left"><?= 1 ?>
<option value="2" style="text-align:left"><?= 2 ?>
</option>
</select>

Js文件

function getboq(work)
{
var boq = work.value;
$.ajax({
            url: 'data/cont_boq.php',
            type: 'post',
            dataType: 'json',
            data: {
                boq:boq,
            },
            success: function (data) {
            window.location = 'boq.php'
                $('#boq').html(data);
            },
            error: function(){
                alert('error');
            }
        });
}

Cont.php

它是一个基于选择框值的普通表，甚至我做了一个简单的表来检查它是否有效但我的努力没有结果

boq.php

是一个简单的php页面，具有所需的div

<div id="boq"></div>

有趣的是，我可以看到对萤火虫的反应，但警告“错误”

Answer 1

您错误地使用了ajax功能。在成功回调中，你正在做两件不兼容的事情。

选择您的行动：

重定向到已包含所需数据的其他页面
根据您的ajax返回数据

div#boq

如果您收到带有“错误”消息的警报，请在错误回调中添加一个参数，该参数将包含返回数据，并显示错误。

error: function(data) { console.log(data); }

您正在将返回数据解析为JSON字符串，这意味着返回数据是一个破碎的，不可解析的json字符串;）

Answer 2

试试这段代码

PHP和脚本代码

添加letest .js库：letest .js library

<select id="works" class="btn btn-default" style="text-align:left; background-color:#FFF">
<option value=""> Select Work Name</option>
<option value="1" style="text-align:left"><?=1?>
<option value="2" style="text-align:left"><?=2?>
</option>
</select>
<div id="boq"></div>
<script type="text/javascript" src='.js library path'></script>
<script type="text/javascript">
$(document).ready(function(){
    $('select').change(function(){
            var boq = $('select option:selected').val();
            $.ajax({
                url: 'data/cont_boq.php',
                //url: 'cont_boq.php',
                type: 'post',
                data: {boq:boq},
                success: function (data) {
                   $('#boq').html(data);
                },
                error: function(){
                    alert('error');
                }
            });
    });

});
</script>

cont_boq.php代码

<table border="2">
    <tr>
        <td>test</td><td><?=$_POST['boq'];?></td>
    </tr>
</table>

无法使用ajax

2 个答案: