Question

我的页面上有3个选择。选择项目后，该值将用于填充下一个选择框。我正在使用jquery ajax函数来执行此操作。

在“addfaq.php”中，我有：

$(document).ready(function() {
$('#product').on('change', function() {  
    var sel = $(this).find('option:selected').text();
    $.ajax({
        url: "addfaq_process.php",
        type: "POST",
        data: {prod : sel},
        success: function(data) {
            $( ".divproduct" ).html(data);
        }
    });
}); 

$('#topic').on('change', function() {  
    var sel = $(this).find('option:selected').text();
    $.ajax({
        url: "addfaq_process.php",
        type: "POST",
        data: {topic : sel },
        success: function(data) {
            $( ".divtopic" ).html(data);
        }
    });
}); 

$('#subtopic').on('change', function() {  
    var sel = $(this).find('option:selected').text();
    $.ajax({
        url: "addfaq_process.php",
        type: "POST",
        data: {subtopic : sel},
        success: function(data) {
            $( ".divsubtopic" ).html(data);
        }
    });
}); 
});

我的问题是我不知道在哪里放<option><select></select></option>语句。如果我将它们放在“addfaq_process.php”中，则onchange不会触发，因为它位于“addfaq.php”中。如果我把它们放在“addfaq.php”中，我不知道如何将信息（我填充了一系列菜单值）添加到“addfaq_process.php”中。一个简单的echo语句只打印数组值，但我需要在菜单中格式化值。

感谢您的帮助！

Answer 1

好像你必须检查你的架构。尝试将html和js集中到一个位置，然后触发特定的ajax调用以从服务器获取特定数据。

根据您的描述，您似乎希望根据用户互动显示某些数据。

一种方法是收听选择元素的更改：

<select id="first_option"> 
   <option>foo</option>
</select>

<强> JS

$("#first_option").change(function(e){
     //Fire ajax with the current value 
      $.post('db.php',function(data){
      //Do something with returned data
       }
})

然后你应该有一个php文件访问你的数据库并发送它（你可以简单地echo这个信息）并使用JS方面的success方法来正确地呈现它。

如何使用jquery AJAX实现3个弹出窗口

1 个答案: