阿贾克斯 - 窗体选择onchange和窗口加载

问题描述：

我有一个电子商务网站的代码位于当用户登陆产品详细信息页面时他们可以选择一个服装尺寸的时候正在开发的一段代码。一旦选择尺寸，它会显示价格和是否有货。这是由选择菜单上的onchange事件触发的。阿贾克斯 - 窗体选择onchange和窗口加载

当页面加载自动选择的第一个尺寸，但不显示内容即价格和库存水平。无论如何，我可以简单地显示这些信息时，页面加载？任何帮助不胜感激。

function showProducts(str) { 
    if (str == "") { 
     document.getElementById("txtHint").innerHTML = ""; 
     return; 
    } else { 
     if (window.XMLHttpRequest) { 
      // code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp = new XMLHttpRequest(); 
     } else { 
      // code for IE6, IE5 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
       document.getElementById("txtHint").innerHTML = xmlhttp.responseText; 
      } 
     }; 
     xmlhttp.open("GET","<?php echo ROOT; ?>ExtraProducts.php?q="+str,true); 
     xmlhttp.send(); 
    } 
}

如果我的回答soved您的问题，请接受答案并关闭这个问题。 – Esko

答

您需要调用方法时dom has loaded。这样做的一个简单方法是将该脚本和呼叫放在身体的尽头。也改变了方法稍微检索的SelectedValue本身，这样你就不必在值传递给函数：

function showProducts() { 
 
    var s = document.getElementById("sizeSelect"); 
 
    var str = s.options[s.selectedIndex].value; 
 
    console.log(str); 
 
    /* Your old code here... */ 
 
} 
 

 
showProducts();

<select onchange="showProducts();" id="sizeSelect"> 
 
    <option value="1">First</option> 
 
    <option value="2" selected>Second</option> 
 
</select>

阿贾克斯 - 窗体选择onchange和窗口加载

相关推荐