填充选择框点击链接

Question

时，我有当用户需要选择颜色和大小的T恤页面（见example here）

我需要填充的“大小”下拉列表中，当用户点击一个颜色（一图像与链接）。

彩色图像/链路的代码将被用于填充看起来像这样：

<a onclick="document.getElementById('productColor10474717').value='120';" class="colorlink" href="https://www.ni-dieu-ni-maitre.com/tshirt_image.php?a=10474717&color=120" target="tshirt_image"> 

（在此链路中，颜色代码将是120）

我已经做了一个PHP脚本来获得必须在下拉列表中填充的结果： https://ni-dieu-ni-maitre.com/_test/tshirt_ajax.php?checkshop=266497&checkproducttype=210&stockcolor=2

“& stockcolo r“是颜色代码的变量。其他2个变量必须保持不变

PHP页面将返回类似的东西：

[{"optionValue":2, "optionDisplay": "2"},{"optionValue":3, "optionDisplay": "3"},{"optionValue":4, "optionDisplay": "4"},{"optionValue":5, "optionDisplay": "5"},{"optionValue":6, "optionDisplay": "6"}] 

我真的新手使用AJAX和我不知道如何实现T恤页面上的AJAX获得结果从PHP页面使用颜色代码变量，然后填充到下拉框中，我需要帮助做到这一点

非常感谢！

Answer 1

使像

<option value="optionValue">optionResult</option> 
<option>.......</option> 
<option>.......</option> 

php文件的打印结果添加ID = “stockcolor” 到每个（a）元素和除去超链接和的onclick的JavaScript等：

<a id="63" class="colorlink" href="#"> 
    <img src="https://image.spreadshirt.com/image-server/v1/appearances/63" width="24" height="24" class="cnormal"> 
</a> 

安装jquery的（加这行到您的文档的头部）：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

然后使用ajax

$(document).ready(function(){ 
    $.ajax({ 
     type: "post", 
     url: "Untitled-3.php?checkshop=266497&checkproducttype=210&stockcolor=" + $('#productColor10474717').val(), 
     success: function(data){ 
      $('select#size').html(data); 
    } 
    }); 


    $('a.colorlink').click(function(){ 
    var stockcolor = $(this).attr('id'), 
     checkshop = 266497, 
     checkproducttype = 210; 

    $.ajax({ 
     type: "post", 
     url: "tshirt_ajax.php?checkshop=" + checkshop + "&checkproducttype=" + checkproducttype + "&stockcolor=" + stockcolor, 
     beforeSend: function(){ 
      $('#productColor10474717').val(stockcolor); 
     }, 
     success: function(data){ 
      $('select#size').html(data); 
      $('#tshirt_image').attr('src', 'https://www.ni-dieu-ni-maitre.com/tshirt_image.php?a=10474717&color=' + stockcolor) 
     } 
    }); 

    }); 
});