PHP函数中的AJAX将应用于函数的每个下一个实例_Php_Jquery_Ajax

PHP函数中的AJAX将应用于函数的每个下一个实例

php jquery ajax

PHP函数中的AJAX将应用于函数的每个下一个实例,php,jquery,ajax,Php,Jquery,Ajax,在PHP函数中有一个.ajax函数，如下所示： function phpFunction($ID) { print "<script> $('.uparrow').click(function(){ request = $.ajax({ 然而，问题是，当我加载phpFunction并单击.uparrow元素时，.ajax调用代表我单击其元素后的phpFunction的每个实例因此，如果我单击phpFunction1的

在PHP函数中有一个.ajax函数，如下所示：

function phpFunction($ID) {
    print "<script>
            $('.uparrow').click(function(){
                request = $.ajax({

然而，问题是，当我加载phpFunction并单击.uparrow元素时，.ajax调用代表我单击其元素后的phpFunction的每个实例

因此，如果我单击phpFunction1的.uparrow，我实际上也会单击phpFunction2和phpFunction3的.uparrow。本质上，我需要.uparrow只是一个本地类，它只应用于当前正在调用的phpFunction实例

我能想到的唯一解决方案是用此函数每次调用的唯一名称替换.uparrow的类名。phpFunction的每个实例之间唯一的区别是它们的输入$ID，我想我可以重新定义。向上箭头为：

或

但这不起作用。那么，如何确保在phpFunction1中单击.uparrow时，.ajax函数只被调用一次

这很难解释，也很难理解，所以请告诉我是否有什么需要细化的内容。

假设您有一个元素列表，当您单击其中一个元素时，您希望执行ajax调用

<a href="#" class="uparrow" data-id="<?= $id1 ?>">click me</a>
<a href="#" class="uparrow" data-id="<?= $id1 ?>">click me</a>
<script>
$(function(){ //on DOM ready
   $('.uparrow').on('click', function(){
      //do ajax call
      $.ajax({
          url: 'url here'
          type: 'post|get'
          data: $(this).attr('data-id'), // you only send the ID of the clicked element
          ... callbacks, etc
      })
   });
})
</script>

现在，您只有一个函数可以进行ajax调用，并从单击的元素中获取要发送的参数

我希望这就是你想要实现的

试试这样的东西

$('[class="uparrow"]').click( function () {

  var request = $.ajax({ 
                 // Your ajax call
               });

});

这将使用.uparrow类对单击的元素执行ajax

HTML 而且

不会多次调用php函数。一次就够了

修改.uparrow元素的标记以包含id，如下所示：

不完全是我的意思。我的问题是，当调用函数时，理想情况下函数的每个部分只调用一次。但是，当我运行.ajax部分时，它也会为后面的phpFunction的每个实例调用。如何防止这种情况发生？您不必多次调用phpFUnction。只需调用它一次，然后按照此处的建议在view/html部分执行其余操作。PHP函数通过从mySQL表提取数据并将其放入html中来生成博客文章。因此，我必须多次运行该函数，输入是表中的行号，以便显示所有帖子。我不想弄得太混乱，所以我把它忘了。很抱歉不是我的意思。问题是阻止.click函数在文档中每隔运行一次.ajax函数。当我单击phpFunction1的.uparrow时，phpFunction2、phpFunction3、phpFunction4等的.ajax函数都会被调用。数据“ajax”让我感到困惑ajax'是一个变量是吗？它是在哪里定义的？@Adam.data'ajax'和attr'data-ajax'指的是两种不同的东西。虽然它将按照您指定的方式工作，但对于数据属性，您应该使用attr方法。@trop.data'ajax'获取数据ajax的值attribute@AdamAzad啊，明白了。但问题不是我在一个列表中有一个类的多个实例。我有多个phpFunction实例，当我在一个phpFunction中使用.uparrow类的实例时，它也同时运行其他函数。我所说的所有函数都是phpFunction的实例。回到我的第一条评论，PHP函数通过从mySQL表中提取数据并将其放入html中来生成博客文章。因此，我必须多次运行该函数，输入是表中的行号，以便显示所有帖子。我不想弄得太混乱，所以我把它忘了。很抱歉我不知道你是怎么做的。。我运行了代码，但是没有一个html出现在开发工具中，可能是因为它在while循环中？我编辑了代码，你能再试一次吗？确保在DB中有带有给定ID的帖子。不，仍然没有html:/。1号、2号和3号职位都存在。不过我很感激你的努力！

class = $ID + 'uparrow'

<a href="#" class="uparrow" data-id="<?= $id1 ?>">click me</a>
<a href="#" class="uparrow" data-id="<?= $id1 ?>">click me</a>
<script>
$(function(){ //on DOM ready
   $('.uparrow').on('click', function(){
      //do ajax call
      $.ajax({
          url: 'url here'
          type: 'post|get'
          data: $(this).attr('data-id'), // you only send the ID of the clicked element
          ... callbacks, etc
      })
   });
})
</script>

$('[class="uparrow"]').click( function () {

  var request = $.ajax({ 
                 // Your ajax call
               });

});

<a class="uparrow" href="#" data-ajax="I'm the first element">Click Me</a>
<a class="uparrow" href="#" data-ajax="I'm the second element">Click Me</a>
<a class="uparrow" href="#" data-ajax="I'm the third element">Click Me</a>

$('[class="uparrow"]').click(function () {

    var currentAjax = $(this).data('ajax')
    console.log(currentAjax);

});

<a class="uparrow" data-id="<?php echo $id; ?>" href="#">TextM/a>

function phpFunction() { /* no need to pass the ID */ ?> 
<script>
$(function(){
   $(document).on('click', '.uparrow', function(){
      $.ajax({
          url: 'URL',
          type: 'POST'.
          data: $(this).attr('data-id')
      })
   });
})
</script>
<?php } ?>

<!doctype html>
    <html>
        <head>
            <title>trop</title>
            <meta charset='utf-8'>
            <link rel='stylesheet' href='css/postStyle.css' />
            <link href='http://fonts.googleapis.com/css?family=Exo+2:400,300,200|Homenaje&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
            <link rel='shortcut icon' href='http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/256/Music-Note-icon.png'>
            <script src='../jquery.js'></script>
            <script type='text/javascript' src='../script.js'></script>
        </head>
    <body>
    <?php
    $ids = array(1,2,3); // IDs of the posts you want
    $result = mysql_query("SELECT * FROM all_posts WHERE ID IN($ids)"); 
    while ($data = mysql_fetch_array($result)){ 
    ?>
        <div class='post' style='width:470px'>
            <h3><?php echo $data['Title']; ?></h3>
            <div class='date'><?php echo $data['DateTime']; ?></div>
            <iframe width='470' height='300' src='http://www.youtube.com/embed/WF34N4gJAKE' frameborder='0' allowfullscreen></iframe>
            <p><?php echo $data['Body']; ?></p>
            <div class='postmeta1'> 
                <p><a href='<?php echo $data['DownloadLink']; ?>' target='_blank'>DOWNLOAD</a></p>
            </div>
            <div class='verticalLine' style='height:39px'></div>
            <div class='postmeta2'> 
                <p class='uparrow' data-id="<?php echo $data['id']; ?>">&#x25B2;</p>
                <div class='votes'>3</div>
                <p class='downarrow'>&#x25BC;</p>
            </div>
            <div class='verticalLine' style='height:39px'></div>
            <div class='postmeta3'> 
                <div class='tags'>
                    <p><?php echo $data['Tags']; ?></p>
                </div>
            </div>
        </div>
    <?php } ?>

    <script>
        var request;
        $('.uparrow').click(function(){
            request = $.ajax({
                url: 'votesHandler.php',
                type: 'post',
                data: { add : '1', ID : $(this).attr('data-id') }
                });
                request.done(function (response, textStatus, jqXHR){
                    alert('Voted!');
                });
                request.fail(function (jqXHR, textStatus, errorThrown){
                    alert(
                        'Oops, something went wrong'
                    );
                });
                request.always(function () {
                    alert('Done.');
                });
        });
    </script>
</body>
</html>