如何使用ajax捕获while循环中的变量?

时间:2013-08-06 23:38:54

标签: php ajax while-loop

我有一个循环来回答类似这样的问题:

<?php
while ($u=mysql_fetch_array($result)){
?>     
<table>
 <tr>
     <td>Question_ID</td>
     <td>Question</td>
     <td>Answer</td>
 </tr>
 <tr>
     <td><? echo $u['question_id'];?></td>
     <td><? echo $u['question'];?></td> 
     <td> 
         <form>
         <input type="hidden" value="echo $u['question_id'];?>" />
         <input type="text"/>
         <a href="#" onClick="ajax_answer();">Send Answer</a>
         </form>
     </td>
 </tr>
</table>
<?php
} 
?>  

如果用户回答了例如页面上出现的第三个问题,我的问题是如何捕获所写的文本和question_id,以便将这些变量发送到php页面?

<script>
   function ajax_answer(){
       $.ajax({
       question_id = ??? //how do I capture this variable?
       answer = ??? //how do I capture this variable?
       url:'answers.php',
       type:'POST',
       dataType:'text/html',
       data:'question_id='+question_id + '&answer='+answer,
       success: function(){
                          };
             });
       };
</script>

谢谢!

3 个答案:

答案 0 :(得分:0)

您更改表单并添加id以便于选择:

     <form>
     <input type="hidden" value="<?php echo $u['question_id'];?>" id="question_id" />
     <input type="text"/>
     <a href="#" onClick="ajax_answer();">Send Answer</a>
     </form>

然后得到这样的值:

  question_id = $("#question_id").val();

或者,如果您的表单只有一个hidden_​​id的隐藏字段:

question_id = $("input[type=hidden]").val();

注意:请考虑使用<?php标签而非短标签<?

答案 1 :(得分:0)

你没有给他们一个身份证。我会给a标签一个带前缀的id,这样你就可以使用相同的id来获取你的相关输入值:

<a href="#" id="q<php echo $u['question_id'];?>" // note that I added a "q" prefix

然后你应该能够通过jQuery这样得到它:

var theid = $(this).attr('id'); // this being the a tag that was clicked

// then just strip off the leading "q" and you have your id.
var thehiddenid = theid.replace('q', '');

答案 2 :(得分:0)

如果你想在纯粹的javascript中执行,
然后将thisajax_answer事件传递到onclick函数,如下所示

<?php
  while( $u = mysql_fetch_array( $result ) ) {
?> 
  <tr>
    <td><?php echo $u['question_id'];?></td>
    <td><?php echo $u['question'];?></td> 
    <td>
      <input type="hidden" value="<?php echo $u['question_id'];?>" />
      <input type="text" />
      <a href="#" onclick="ajax_answer( this );">Send Answer</a>
    </td>
  </tr>
<?php
  }
?>

,你的javascript将会......

<script type="text/javascript">
  function ajax_answer( elem ) {
    var question_id = elem.parentElement.children[0].value;
    var answer      = elem.parentElement.children[1].value;

    /// do your request here

    return false;
  }
</script>

和jQuery一样 将name属性添加到这些输入元素,并将classname添加到anchor元素

<?php
  while( $u = mysql_fetch_array( $result ) ) {
?> 
  <tr>
    <td><?php echo $u['question_id'];?></td>
    <td><?php echo $u['question'];?></td> 
    <td>
      <input type="hidden" name="question_id" value="<?php echo $u['question_id'];?>" />
      <input type="text" name="answer" />
      <a href="#" class="send_answer">Send Answer</a>
    </td>
  </tr>
<?php
  }
?>

<强>的Javascript
动态添加onclick事件处理程序。现在,您的函数ajax_answer接受两个参数question_idanswer,我们将通过click事件处理程序传递这两个参数

<script type="text/javascript">
  $(function() {
    $("a.send_answer").on("click", function( event ) {
      event.preventDefault();
      var td  = $(this).parents("td:first");
      var qid = $("input[name=question_id]", td).val();
      var ans = $("input[name=answer]", td).val();

      ajax_answer( qid, ans );
    });
  });
  function ajax_answer( question_id, answer ) {
    /// do your request here
  }
</script>