如何将隐藏字段中的变量发送到远程PHP文件，并在不使用jQuery刷新的情况下在Bootstrap模式中显示脚本的结果？

我在一个表中生成dinamically表格：

文件index.php

session_start(); ... 
 当我点击发送时，它会将信息发送到remote.php上的脚本： 
 文件remote.php 
 <?php session_start(); $name = $_POST['name']; $band = $_POST['band']; $indx = $_POST['indx']; $up = $indx * 2; $output = ' 
 
 
 
 × 
  Rock Modal 
 
 
 The band '.$band.' has an up index of '.$up.'!'; 
 
 
 
'; $_SESSION['output'] = $output; header('Location: index.php'); 
 然后index.php是新加载的，但现在它打开一个模式框，其中包含来自remote.php的输出： 
 
 
 
Name
 
Band
 
Indx
 
Send
 
 
 
Bruce
 
Iron Maiden
 
95
 
 
    SEND  
 
 
 
James
 
Metallica
 
90
 
 
    SEND  
 
 




 ...  if(isset($output){ echo $output; }  // Compare Modal $('#rock-modal').modal('show');  

但现在我想做同样的事情，但没有页面重新加载，即使用jQuery。

我做了一些研究，并在StackOverflow中使用另一种方法提出了一个问题（ 如何使用php在bootstrap模式中显示来自远程文件的动态内容？ ）以获取有关它的更多信息。 有了这个有价值的信息，我做了以下事情：

   Bruce Iron Maiden 95  
    
 OK   $(function() { $('.rock-send').on('click', function() { var data = $(this).closest('tr').find('>td:lt(3)'), modal = $(this).data('modal'); $.post( $(this).data('href'), { name: data.name.text(), band: data.band.text(), indx: data.indx.text(), }, function( data ) { $(modal).modal('show'); }); }); }); 

但不知怎的，它不起作用。 我不确定remote.php是否可以读取发送的变量并将其返回。 我该如何管理它？ 这可能是javascript中的一个问题。 我将不胜感激任何帮助！ 先感谢您。

==编辑==

这里是index.php的代码，基于注释。

      
 
 
Bruce
 
Iron Maiden
 
95
 
 
    
 OK 
 
 
 
James
 
Metallica
 
90
 
 
    
 OK 
 
 
    $(function() { $('.rock-send').on('click', function() { var name = $("input[name='name']").val(); var band = $("input[name='band']").val(); var indx = $("input[name='indx']").val(); $.post('remote.php', { name: name, band: band, indx: indx, }, function( data ) { $("#rock-modal").html(data); $("#rock-modal").modal('show'); }); }); });    

这里是完整的remote.php

 <?php $name = $_POST['name']; $band = $_POST['band']; $indx = $_POST['indx']; $up = $indx * 2; $output = ' 
 
 
 
 × 
  Rock Modal 
 
 
 The band '.$band.' has an up index of '.$up.'!!! 
 
 
 
'; echo $output; 

但不幸的是没有任何事情发生。 ： – \

Answer 1

以下是一些可以帮助您解决此问题的建议：

• 模态标记（HTML）属于主页index.php
• 如果您希望remote.php返回多个值，请返回JSON
• 听取表单的submit事件而不是click事件总是更好。
• 一定要包含jQuery和Bootstrap（js＆css）
• remote.php执行的处理（如果这就是它正在做的事情）实际上可以在客户端使用JavaScript执行，这意味着您不需要提交表单，也不需要remote.php 。

那么您的JavaScript应该是：

 $(document).ready(function(){ $('.rock').on('submit', function( e ){ e.preventDefault(); var band = $(this).find('input[name=band]').val(), indx = +$(this).find('input[name=indx]').val(), up = indx * 2; $('#rock-modal').find('.modal-body') .text( 'The band ' + band + ' has an up index of ' + up + '!!!' ).end() .modal('show'); }); }); 

DEMO

Answer 2

试试这个，

 $(function() { $('.rock-send').on('click', function() { var name = $("input[name='name']").val(); var band = $("input[name='band']").val(); var indx = $("input[name='indx']").val(); $.post('remote.php', { // dont forget to change the remote url there name: name, band: band, indx: indx, }, function( data ) { $("#rock-modal").html(data); // data is response from your remote php srcipt // so set this data to div with id "rock-modal" $("#rock-modal").modal('show'); // and show the div with id rock-modal }); }); });