Question

我有以下组合框，用于设置每页显示的图像数量。我有原始的PHP代码工作，但我在使用jQuery将其更改为Ajax时遇到了很多麻烦。

看起来组合框部分正在工作，但由于图像没有显示，很难说。我希望有人可以帮助我。

HTML

<form>
    <label>Images Number:</label>
    <select id="imgNum" name="imgNum">
        <option value="12">12</option>
        <option value="16">16</option>
        <option value="20">20</option>      
    </select>
</form>

<div id="imgTray"></div>

jQuery

//Bind the onChange event to Fetch images on combox selection
$("#imgNum").change(function(){
    //The combo box
    var sel = $(this);
    //Selected value
    var value = sel.value();

    //Fetch the images
    $.get("get_images.php",{imgs: value}, function(data){
        //Add images to the document
        $("#imgTray").html(data);
    });
})

//You should store the current selected option in a cookie
//For the sake of the example i'll set the default permanently to 12
var imgNum_selected = 12;

//set the initial selected option and trigger the event
$("#imgNum [value='"+imgNum_selected+"']")
    .prop("selected","selected")
    .change();

PHP

<?php

    if((int) $_GET['imgs'] > 0){ 
        $limit = (int) $_GET['imgs']; 
    } else { 
        $limit = 12; 
    }

     $curPage = 0;
     if(isset($_GET['page'])){
        $curPage = (int) $_GET['page'];
     }

    $mysql_link = mysql_connect("localhost", "root", "root");   
    mysql_select_db("new_arrivals_imgs") or die("Could not select database");

    $query = mysql_query("SELECT `imgURL`,`imgTitle` FROM `images` ".
    "ORDER BY `imgDate` DESC LIMIT " . $limit * $curPage . ", $limit") or die(mysql_error());

    if(!$query) {
        echo "Cannot retrieve information from database.";
    } else { 
    while($row = mysql_fetch_assoc($query)) { 
        echo "<li><a href='new_arrivals_img/".$row['imgURL']."' class='gallery' title='".$row['imgTitle']."'><img src='new_arrivals_img/thumbnails/".$row['imgURL']."'></a></li>";
      }
    }

?>

提前感谢您提供的任何帮助。

Answer 1

你有一个拼写错误，方法是val()，而不是value()：

var value = sel.val();

例如（没有AJAX的东西）：http://jsfiddle.net/ambiguous/u3c9G/

jQuery Ajax Combo框无效

1 个答案: