javascript - onClick 将 PHP 代码回显到 div (AJAX)

Question

所以我想做的是:

首先:当按钮add-location单击此按钮会使用 AJAX 加载一个 php 文件。

jQuery

$('.add-location').click(function() {
        var locationName = $(this).data('location');
            $.post('http://www.example.com/reload-location-2.php?addparam',
            {locationName: locationName}, function(data) {
                $("textarea#location").html(data);
        })
    });

PHP 文件

<?php start_session();
$locationName = array_key_exists('locationName', 
$_POST) ? (string) $_POST['locationName'] : '';

   if(isset($_GET['delparam'])){
       unset($_SESSION['locations'][$locationName]);
   }

   if(isset($_GET['addparam'])){
    $_SESSION['locations'][$locationName] = $locationName;
   }
?>

<?php foreach ($_SESSION['locations'] as $location): ?>
<?php echo htmlspecialchars($location); echo "\n"; ?>
<?php endforeach;?>

这一切都很有魅力!不用担心。不，我想做的是当按钮 add-location点击这个echo's以下代码为div称为 textarea#thema .

<?php foreach ($_SESSION['products'] as $product): ?>
    <?php echo htmlspecialchars($product); echo "\n"; ?>
<?php endforeach;?>

或者，如果在加载页面时更容易 -> 将该代码回显到 textarea#thema分区

我不太了解 AJAX，但我已经了解了。但我认为最后一个选项可能是最简单的解决方案？

谁能帮我解决这个问题？

---

我尝试过的

现在，当按钮 add-location单击我重新加载以前的 jQuery 脚本:

$('.add-location').click(function() {
        var productName = $(this).data('product');
            $.post('http://example.com/reload-2.php?addparam',
            {productName: productName}, function(data) {
                $("textarea#thema").html(data);
        })
    });

这有效，但它增加了一个额外的 <p> -tag 在代码中留下一个换行符。

我还更改了 .html(data);至 .val(data);对于文本区域。我还用这段代码制作了一个新的 PHP 文件:

<?php foreach ($_SESSION['products'] as $product): ?>
    <?php echo htmlspecialchars($product); echo "\n"; ?>
<?php endforeach;?>

还有这段 jQuery 代码:

 $('.add-location').click(function() {
            var productName = $(this).data('product');
                $.post('http://www.example.com/reload-3.php', 
                {productName: productName}, function(data) {
                   $("textarea#thema").val(data);
            })
        });

但还是不行...而且我不认为这是要走的路？我希望我提供了足够的信息。

Answer 1

您应该使用 .val() 函数来填充文本区域，而不是 .html()。