如何在JavaScript中的“onclick”中显示MySQL的下一个结果?

时间:2010-09-09 23:54:37

标签: php javascript mysql

我想显示一定数量的结果(例如,5)并制作一个:

<a href="" onclick="<?php ShowNextResult(); ?>">

使用onlick显示接下来的5个结果。

4 个答案:

答案 0 :(得分:3)

编辑:: HTML

<div id="results">
   <div class="result"></div>
   <div class="result"></div>
   <div class="result"></div>
</div>
<a href="#" id="showMore" />Show more</a>

JAVASCRIPT 使用Jquery如下

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript">
$(function(){
      $('#showMore').click(function(event) {
         event.preventDefault();
         $number = $('.result').size();

        $.ajax({
           type: "POST",
           url: "getNext.php",
           data: "count=$number",
           success: function(results){
             $('#results').append(results);
           }
         });

      });

});
</script>

PHP

你应该创建一个新的php页面(getNext.php)来获取查询结果

<?php
$con = mysql_connect("localhost","peter","abc123");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("my_db", $con);

$result = mysql_query("SELECT * FROM Persons LIMIT {$_POST['count']},5");

while($row = mysql_fetch_array($result))
  {
  echo "<div class='result'>".$row['FirstName'] . " " . $row['LastName']."</div>";
  }

mysql_close($con);
?>

帮助

您可以使用类似

的SQL
SELECT x,xx,xxx FROM XxXxXs Limit $_POST['count'],5

答案 1 :(得分:0)

由于您特别提到JavaScript我假设您不想重新加载页面或类似的东西。你的onClick必须触发一个AJAX调用你服务器上的php页面,它将处理请求并返回接下来的五个记录(或最后5个记录,或随机的记录等)。

JQuery非常受欢迎,并且具有内置功能,可以简化此过程。

http://api.jquery.com/jQuery.ajax/

以下是一些教程:http://docs.jquery.com/Tutorials

您最好的选择是使用JavaScript编写此功能。使页面接受参数以显示特定记录。一旦你完成了代码,然后把AJAX放在它上面,但是如果你需要兼容性或者事情不能按照你需要的方式工作,你就会有旧的东西。 / p>

这些是非常一般的答案,您是否需要特定的帮助才能使查询仅显示接下来的5条记录?或者将特定的PHP代码绑在一起?或者只是JS来做AJAX的东西?如果您需要更多信息,可以更具描述性吗?

答案 2 :(得分:0)

更改

data: "count=$number",

data: "count=" + $number,

因为那时它不起作用!

答案 3 :(得分:0)

这是我的解决方案,显示测验问题部分使用下一个按钮意味着每次点击下一步按钮5将显示更多问题。

    <?php
    $strSQL="SELECT * FROM `quizes` WHERE Q1 IS NOT NULL ORDER BY RAND()";
    $result=mysql_query($strSQL);
      while($row=mysql_fetch_array($result)){
    $c=0;   
    $q[]= $row['Q1']; // This is database record that has all question stored as array
    ?>

    <?php   
    for($inc=0; $inc < $ret; $inc++){ ?>
    <table>
        <tr id="<?php echo "i".$inc ?>">
            <td id="qs"> <?php  print_r($q[$inc]); ?></td> 
    </tr></table> 
    <!-- here in i am display all question with loop in this variable $q[$inc] -->

    <?php } ?>

    // Now we are going to display partial 
    instead of all so data will display partially with next button


    <a href="#" id="more">Next/Show More</a> 
    //this is anchor/button on which more questions will load and display when clicked


    //CSS question are placing in tr (table row) so first hide all question

    <style>

    tr{
        display:none
    }

    </style>

    //jquery now we will show partial question 5-questions at each click
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

    <script>
    $(document).ready(function(){
  $("[id=i0],[id=i1],[id=i2],[id=i3],[id=i4],[id=i5]").show();
//Display first 5-question on page load other question will 
//show when use will click on next button

       var i=0;

        $("#more").click(function(){ // Next button click function
    //questions tr id we set in above code is looping like this i1,i2,i3,i4,i5,i6...

    i=i+5; //at each click increment of 5 question

       var e=i+5; 
//start after the last displayed question like if previous result was 1-5 question then next result should be 5-10 questions...
        for(var c=i; c < e; c++  ){

            $("[id=i"+c+"]").show();
          }

        });
        });
    </script>