Question

这是我的HTML代码：

<a href="#" onclick id="Ana"> Apasa texul 1</a>
<p><?php if(isset($_POST['name']))echo $_POST['name'];else echo 'rusu';?></p>

这是我的jquery代码：

$('#Ana').click(function(){
    var name = $(this).attr('id');
    $.ajax({
        type: "POST",
        url: "index.php",
        data:  {
            name:name
        },
        success:function(){

        }
    })
});

我想在点击Ana后显示Apasa texul 1，但它永远不会有效。

Answer 1

会有很多不同的方法来执行此操作，但是如果您要使用内联函数调用，则可以声明一个名为swapTag()（或您喜欢的名称）的自定义函数，它将生成一个新的{ {1}}标签，然后用原始标签<span>的值填充它，然后用新生成的元素替换原始dom元素。

id

function swapTag(el) {
  let newEl = document.createElement('span');
  newEl.innerHTML = el.id;
  el.parentNode.replaceChild(newEl, el);
}

尽管您已声明希望将<a href="#" id="Ana" onclick="swapTag(this);">Apasa texul 1</a>标记替换为<a>标记，但是如果您想将<span>替换为纯文本，这也将起作用：

<a>

这个问题的上下文并不多，所以我不知道您的项目实际需要多少工具。内联函数调用可能是一个丑陋的选择-使用侦听器可能是一种更干净的方法。

我将添加一个将使用Jquery和事件侦听器的替代方法（这样您就不会再通过内联函数调用弄混自己的dom了……再次，很难为您提供“完美”的答案，因为我们对您的应用程序了解不多。

<a href="#" id="Ana" onclick="this.outerHTML = this.id;">Apasa texul 1</a>

$(document).ready(function() {
    $('a[href="#"][id]').click(function(){
        let oldEl = this,
            newEl = document.createElement('span');
        newEl.innerHTML = oldEl.id;
        oldEl.parentNode.replaceChild(newEl, oldEl);
    }); 
});

同样，如果您只想将<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a href="#" id="Ana">Apasa texul 1</a> <a href="#">Apasa texul 1</a> <a href="#" id="Someone else">Apasa texul 1</a>标记替换为文本，则这是jquery-listener版本（侦听具有<a>值的<a>标记的单击href和包含任何内容的#属性）：

id

Answer 2

在PHP上，您必须这样做（将此代码放在页面顶部）：

 <?php
  if(isset($_POST['name'])) 
  {
    echo $_POST['name'];
    exit;
  }
 ?>

在JS上：

$('#Ana').click(function()
{
    var name = $(this).attr('id');
     $.ajax( 
                {
                    type: "POST",
                    url: "index.php",
                    cache: false,
                    data:  {'name':name},
                    dataType: 'text',
                    success:function(result) 
                    {
                        alert(result);
                    }
                }
            )
});

警报将显示PHP的回显值。从那里开始随心所欲......像$('p').html(result);

因为你正在进行ajax调用，所以你不能依赖你编写的内联代码，因为页面没有被完全刷新。该代码在您第一次加载页面时执行，但是因为当发生这种情况时，您不会通过POST（通常）在初始语句中传递参数“else”始终执行。

如果不执行“退出”，则在调用ajax时在上面的代码中，您将收到结果中的整个页面。这就是为什么代码必须位于页面顶部，并且必须在之后调用退出。

Answer 3

您不需要所有这些东西。

如果我了解整体，则希望在单击链接时达到：

执行AJAX调用
无论调用如何，都用其ID属性替换整个链接

<a href="#" onclick="performAjaxCall(this); this.outerHTML = this.id; return false;" id="Ana"> Apasa texul 1</a>

是最快的方法，因为您的AJAX调用位于performAjaxCall()中。

Answer 4

<a href="#" onclick id="Ana"> Apasa texul 1</a>
<p><?php if(isset($_POST['name']))echo $_POST['name'];else echo 'rusu';?></p> /** 2nd line **/

2nd line并不是要在AJAX请求之后执行，只有在正常请求整个页面时才会执行。

要获得想要的结果，您可以：

在JavaScript部分中，附加点击处理程序时，您需要防止a元素的默认行为（重定向为href属性，（如果是#，则在大多数情况下，页面会滚动到顶部）。另外，为了区分请求是AJAx请求，您可以使用POST变量（例如设置为1）在服务器端进行检查。
在PHP部分中，检查是否设置了$_POST['isajax']（应告诉我们我们有一个AJAX请求的变量）和$_POST['name']，并且{ {1}}等于$_POST['isajax']，然后等于1 echo，然后停止脚本。另外，这些检查很可能放在$_POST['name']文件的顶部。

PHP部分可能类似于：

JavaScript

和$('#Ana').click(function(e) { e.preventDefault(); /** prevents the link's default behavior **/ var name = $(this).attr('id'); $.ajax({ type: "POST", url: "index.php", data: { isajax: 1, /** means we have an ajax request, it's not that **/ name: name }, success: function(response) { alert(response) } }) });部分（PHP页面的顶部）看起来像是：

index.php

如何使用jquery将变量返回到相同的php页面

4 个答案: