如何将JS对象从双击监听器传递给<button>的点击监听器？

Question

JSFiddle here

＆＃13;

＆＃13;

$(".button-collapse").sideNav();

$('.button-collapse').sideNav({
		menuWidth: 300, // Default is 300
		edge: 'left', // Choose the horizontal origin
		closeOnClick: true, // Closes side-nav on <a> clicks, useful for Angular/Meteor
		draggable: true, // Choose whether you can drag to open on touch screens
    onOpen: function(el) {
				alert("Drawer opened");//check
		},
		onClose: function(el) { 
				alert("Drawer closed");//check
		}
});






$("button").click(function() {
  alert("Here I need to send the JS object named 'data' in the dblclick() listener, to the server, in an AJAX request. THE QUESTION IS how do I get that 'data' from the dblclick() listener to here?");
});










$("table tr.table-row").dblclick(function(e) {
  var values = $(e.target).parent().text().split('\n');
  var keys = $('thead').text().split('\n');
  var processed_keys = new Array();
  var processed_values = new Array();
  var data = {};

  for(var i = 0; i < keys.length; i++){
    if(keys[i].trim() !== ""){
      processed_keys.push(keys[i].trim());
    }
  }
  
  for(var i = 0; i < values.length; i++){
    if(values[i].trim() !== ""){
      processed_values.push(values[i].trim());
    }
  }
  
  for(var i = 0; i < processed_keys.length; i++){
    data[processed_keys[i]] = processed_values[i];
  }

  console.log(data);
  alert("Following is the dataset that needs to be sent to the click listener of the button");
  alert(data);
  
  $('.button-collapse').sideNav('show');
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css" rel="stylesheet"/>







<section id="slide-out" class="side-nav blue-grey lighten-4"><button>Send AJAX request</button></section>
<a href="#" data-activates="slide-out" class="button-collapse" style="display:none;"><i class="material-icons">menu</i></a>








<table class="responsive-table">
<thead>
  <tr>
    <td>Name</td>
    <td>Place</td>
    <td>Animal</td>
    <td>Thing</td>
  </tr>
</thead>

<tbody>
  <!-- A Number Of Rows -->
  <tr class="table-row">
    <td>Bob</td>
    <td>Berlin</td>
    <td>Mouse</td>
    <td>TV</td>
  </tr>
  <tr class="table-row">
    <td>Luke</td>
    <td>Munich</td>
    <td>Giraffe</td>
    <td>Radio</td>
  </tr>
  <!-- A Number Of Rows -->
</tbody>
</table>

＆＃13;

＆＃13;

＆＃13;

有一个HTML <table。当用户双击其行<tr>时，将调用dblclick()侦听器。在这个监听器中，我从以键值对（即JS对象）的形式单击的行中检索数据。让我们称这个JS对象为 Dataset A 。此外，在这个听众中，打开了一个侧抽屉，其中有一个按钮。

这就是我需要的：

当用户点击上述按钮时，它应该将AJAX请求中的 Dataset A 发送到服务器。问题是，按钮的点击监听器如何获得 Dataset A ？

我的问题是，如何将Dataset A从dblclick()的{​​{1}}监听器传递给按钮的<tr>监听器，以便我可以将它以AJAX请求发送到服务器？

Answer 1

由于它们位于同一页面中，因此将项目保存在var中的某个位置并在按钮中使用它 - 例如将&c[0]移动到函数外部并在dblclick中使用var data;或使用的sessionStorage

也只有一套jQuery脚本

＆＃13;

＆＃13;

data = {};

＆＃13;

var data;
$(function() {
  $(".button-collapse").sideNav();

  $('.button-collapse').sideNav({
    menuWidth: 300, // Default is 300
    edge: 'left', // Choose the horizontal origin
    closeOnClick: true, // Closes side-nav on <a> clicks, useful for Angular/Meteor
    draggable: true, // Choose whether you can drag to open on touch screens
    onOpen: function(el) {
      alert("Drawer opened"); //check
    },
    onClose: function(el) {
      alert("Drawer closed"); //check
    }
  });

  $("button").click(function() {
    alert(JSON.stringify(data));
  });

  $("table tr.table-row").dblclick(function(e) {
    var values = $(e.target).parent().text().split('\n');
    var keys = $('thead').text().split('\n');
    var processed_keys = new Array();
    var processed_values = new Array();
    data = {}; // initialise

    for (var i = 0; i < keys.length; i++) {
      if (keys[i].trim() !== "") {
        processed_keys.push(keys[i].trim());
      }
    }

    for (var i = 0; i < values.length; i++) {
      if (values[i].trim() !== "") {
        processed_values.push(values[i].trim());
      }
    }

    for (var i = 0; i < processed_keys.length; i++) {
      data[processed_keys[i]] = processed_values[i];
    }

    console.log(data);
    alert("Following is the dataset that needs to be sent to the click listener of the button\n"+JSON.stringify(data));

    $('.button-collapse').sideNav('show');
  });
});

＆＃13;

＆＃13;

＆＃13;