3

这段代码，如果点击里面的文本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代码，则不会发送任何内容。并发送所有vars。

必须将代码发送到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();

现在看来工作了。但认为代码需要改进

4

1 回答 1

3

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

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

索引.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>

__popup-window_ajax.php：

<?php
$var = $_POST['clickedText'];
echo json_encode($var);
?>
于 2013-07-13T09:54:58.693 回答