Question

我想根据结果制作动态按钮。如果我点击一个按钮，它会在按钮中检索结果。

$('#but').click(function(){
    $.ajax({
         type:"POST",
         url:"tab.php",
         data:{id:this.id},
         success:function (result){
         alert(response);
         $("#show").html(result);

         }
         });

           });

my tab.php

<?php
$result = mysql_query("show tables");


while($tbl_str = mysql_fetch_array($result)) 
{ 
 echo ucwords($tbl_str[0]);    
}
?>

Answer 1

如果我理解你的问题，你可以这样做：而不是

$("#show").html(result);

使用

$("#show").append("<button>"+result+"</button>");

您不必将html()更改为append()，但在这种情况下，它不会替换现有按钮，因此我认为它更适合您

Answer 2

我认为您需要单独设置按钮，如果返回的结果是employee,travels，那么您需要2个按钮employee和travels，如果是这样，我会创建一个创建的功能名称为

的按钮

<script type="text/javascript">

    $('#but').click(function() 
    {
        $.ajax({
            type: "POST",
            url: "tab.php",
            data: {id: this.id},
            success: function(result) 
            {
                makeButtons(result);
            }
        });
    });


    function makeButtons(buttonsString)
    {
        // you can clear #show tag
        $('#show').html('');

        var buttonsArray = buttonsString.split(',');

        for(var i = 0; i < buttonsArray.length; i++)
        {
            makeButton(buttonsArray[i]);
        }
    }


    function makeButton(buttonName)
    {
        // you can also add some events atc.. 
        // if u want clicking this button to do something
        $('#show').append('<button>' + buttonName + '</button>');
    }

</script>

Answer 3

在php文件中，以ajax请求中使用的json格式返回数组。

$result = mysql_query("show tables");
$array = array();
while($tbl_str = mysql_fetch_array($result)) 
{
    $array[] = ucwords($tbl_str[0]);    
}
$output['result'] = $array;
echo json_encode($output);
exit;

您的ajax功能，使用dataType:'json'

$.ajax({
   type:"POST",
   dataType:'json',
   url:"tab.php",
   data:{id:this.id},
   success:function (result){
      //alert(result.result);
      $.each( result.result, function( index, value ){
            //alert(value);
            $("#show").append("<button>"+value+"</button>");
      });
   }
});

如何动态追加按钮

3 个答案: