Question

此代码，如果单击div class="example4DOMWindow"内的文本，则将已定义的值发送到php，然后返回php数据，并在弹出窗口中显示从php接收的数据。

以下是示例http://jsfiddle.net/rigaconnect/q3RcV/1/

这是发送和接收数据的ajax

$(document).ready(function()
{
    var one = $("#first_var").text();
    var two = $("#second_var").text();
    $.ajax({
        type: "POST",
        url: '__popup-window_ajax.php',
        data: {var1: one, var2: two },
        dataType: "json",
        success: function(data) {
            $('#load').html(data);
        }
    });
});

此部分代码显示弹出窗口（此处为http://swip.codylindley.com/DOMWindowDemo.html示例）

<body>

<div id="first_var" class="example4DOMWindow" style="width: 50px;">text one</div>
<div id="second_var" class="example4DOMWindow" style="width: 50px;">text two</div>

<script type="text/javascript">
    $('.example4DOMWindow').openDOMWindow({
        eventType:'click',
        windowSourceID:'#example4InlineContent',
    });

</script>
<div id="example4InlineContent" style="display:none">
    <div>
        <div id="load"></div>
    </div>
</div>

</body>

这是php文件代码

$p_one = $_POST['var1'];
$p_two = $_POST['var2'];
$test = $p_one. '<br>test<br>'. $p_two;
echo json_encode($test);

代码仅向php发送已定义的var。与var one = $("#first_var").text();一样，如果var代码中没有ajax，则不会发送任何内容。并发送所有var s。

只需点击文字即可向php发送代码。用户点击text one，发送text one，不发送text two;点击text two，仅发送text two。

此处https://stackoverflow.com/a/17622947/2360831 / http://jsfiddle.net/aGWGn/5/ 点击的文本作为值传递给javascript。

试图像这样把所有人放在一起

$(document).ready(function(){

    document.body.onmousedown = whichElement;
    var output = document.getElementById("load")
    function whichElement(e) {
        e = e || window.event;
        var targ = e.target || e.srcElement;
        if (targ.nodeType===3) {// defeat Safari bug
            targ = targ.parentNode;
        }
        output.innerHTML = targ.innerHTML;
    }
    //var one = $("#first_var").text();
    var one = targ;
    var two = $("#second_var").text();

    $.ajax({
        type: "POST",
        url: '__popup-window_ajax.php',
        data: {var1: one, var2: two },
        dataType: "json",
        success: function(data) {
            $('#load').html(data);
        }
    });
});

但代码未将var one = targ;传递给php文件（var two也未通过）。

根据我的理解，主要问题是如何将var targ或var output（？）传递给var one ....

请，建议不正确的

更新

将data更改为data: {var1: output, var2: two },

并在弹出窗口中看到

[object HTMLDivElement]
test
text two
text two

已更改为var one = targ.innerHTML;但无效....

开始工作的变化

将var output = document.getElementById("load")更改为var output = document.getElementById("load1")

在html中添加了<div id="load1"></div>

并改变了

//var one = $("#first_var").text();
var one = targ;
var two = $("#second_var").text();

到var one = $("#load1").text();

现在看起来很有效。但认为代码需要改进

Answer 1

根据我的理解，你只需要将点击的文本传递给php，对吗？

如果是这样，从使用jquery的那一刻起，您就不需要所有代码。您只需要将“点击”事件处理程序附加到.example4DOMWindow并仅发送所点击的div的文本。

<强>的index.html：

<body>
<!--
<script src="jquery-2.0.3.js"></script>
<script src="jquery.DOMWindow.js"></script>
-->
<div id="first_var" class="example4DOMWindow">text one</div>
<div id="second_var" class="example4DOMWindow">text two</div>

<div id="example4InlineContent" style="display:none">
   <div id="load"></div>
</div>

<script>
$(document).ready(function() {

  $('.example4DOMWindow').openDOMWindow({
      eventType:'click',
      windowSourceID:'#example4InlineContent',
  });  

  $(".example4DOMWindow").on('click', function(event){
    $.ajax({
      type: 'POST',
      url: '__popup-window_ajax.php',
      data: { 'clickedText' : $(this).text() },
      success: function(data) {
        $('#load').html(data);
      }
    });
  });

});
</script>

</body>

<强> __弹出-window_ajax.php：

<?php
$var = $_POST['clickedText'];
echo json_encode($var);
?>

使用ajax和json将单击的文本发送到php并在弹出窗口中获取php数据

1 个答案: