Question

我有一个标记为first_page.php的PHP脚本。在那个页面上，我目前有一个看起来像这样的div：

<div id="status">
  <h3>To view a list of all rooms statuses, select the link below.</h3>
  <a href="response_data.php" class="button">Show Status</a>
</div>

指向正确页面response_data.php的链接。我真正希望拥有的是first_page.php上的按钮，当点击该按钮时，请让response_data.php页面加载.fadeIn()。< / p>

我试图让这个jQuery脚本正常工作，没有运气。这是我尝试过的。我已将我的HTML更改为如下所示：

<button id="button">Click here to show data</button>
  <div id="data" style="display: none;"> 
<?php include 'response_data.php' ?>
</div>


$('#button').click(function() {
  $('#data').fadeIn(1000);
});

上面，我添加了一个按钮和一个我想淡入的div。 div保存了php脚本，所以我希望div能够淡化php脚本。我将数据CSS设置为none。当我点击按钮时，没有任何反应。它确实有效，但div数据在没有点击按钮的情况下消失了。然后按钮保持不变。我希望不要自动点击，并在第一次点击后以某种方式隐藏按钮。

Answer 1

jQuery部分很好。我强烈建议检查您的div#data是否确实包含一些文字。

为此，您可以尝试以下方式：

console.log($('#data').text().length > 0 ? 'Text found' : 'Could not find text');

此外，要在点击按钮后隐藏按钮，只需使用hide()方法：

$('#button').on('click', function() {

    $('#data').fadeIn(1000);
    $(this).hide();

});

注意：如果您想从DOM中删除按钮，也可以使用fadeOut()方法或remove()方法。

使用jQuery onClick按钮淡入PHP脚本

1 个答案: