Ajax没有'由于缺乏投入而无法工作

Ajax doesn't work because lack of input

本文关键字：工作 于缺乏 没有 Ajax      更新时间：2023-09-26

我在我的网站上实现了一个AJAX脚本，它控制一些输入，但有一种情况是，我的输入只在使用范围滑块后显示。如果我不将范围滑块仅用于其他输入，我的脚本将无法运行。我的AJAX如下：

<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
 var ajaxRequest;  // The variable that makes Ajax possible!
 try{
   // Opera 8.0+, Firefox, Safari
   ajaxRequest = new XMLHttpRequest();
 }catch (e){
   // Internet Explorer Browsers
   try{
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
   }catch (e) {
      try{
         ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
      }catch (e){
         // Something went wrong
         alert("Your browser broke!");
         return false;
      }
   }
 }
 // Create a function that will receive data 
 // sent from the server and will update
 // div section in the same page.
 ajaxRequest.onreadystatechange = function(){
   if(ajaxRequest.readyState == 4){
      var ajaxDisplay = document.getElementById('ajaxDiv');
      ajaxDisplay.innerHTML = ajaxRequest.responseText;
   }
 }
 // Now get the value from user and pass it to
 // server script.
 var bedno   = document.getElementById('bedno').value;
 var district   = document.getElementById('district').value;
 var loc        = document.getElementById('location').value;
 var price1   = document.getElementById('price1').value;
 var price2   = document.getElementById('price2').value;
 var queryString = "?bedno=" + bedno ;
 queryString +=  "&district=" + district + "&price1=" + price1 + "&price2=" + price2 + "&location=" + loc;
 ajaxRequest.open("GET", "ajax-example.php" + 
                              queryString, true);
 ajaxRequest.send(null); 
}
//-->
</script>

var price1和price2是在范围滑块未使用时未定义的两个变量。我想这就是我的脚本无法运行的原因。是什么原因导致了问题？

我的滑块仅在使用滑块时生成，因此在访问者单击滑块之前，该值将丢失，但我希望它在没有滑块脚本的情况下显示。：

$('.priceSlider').slider({
    range: true,
    min: 0,
    max: 2000,
    values: [500, 1500],
    step: 100,
    slide: function(event, ui) {
        $('.priceSlider .sliderTooltip .stLabel').html(
            '€' + ui.values[0].toString().replace(/('d)(?=('d'd'd)+(?!'d))/g, "$2,") + 
            ' <span class="fa fa-arrows-h"></span> ' +
            '€' + ui.values[1].toString().replace(/('d)(?=('d'd'd)+(?!'d))/g, "$1,") +
            ' <input type="hidden" id="price1" style="position: absolute;" onchange="ajaxFunction()"  value="'+  ui.values[0].toString().replace(/('d)(?=('d'd'd)+(?!'d))/g, "2") +'" />' +
            ' <input type="hidden" id="price2" style="position: absolute;" onchange="ajaxFunction()" value="'+  ui.values[1].toString().replace(/('d)(?=('d'd'd)+(?!'d))/g, "1") +'" />'
        );
        var priceSliderRangeLeft = parseInt($('.priceSlider .ui-slider-range').css('left'));
        var priceSliderRangeWidth = $('.priceSlider .ui-slider-range').width();
        var priceSliderLeft = priceSliderRangeLeft + ( priceSliderRangeWidth / 2 ) - ( $('.priceSlider .sliderTooltip').width() / 2 );
        $('.priceSlider .sliderTooltip').css('left', priceSliderLeft);
    }
});

任何可能的解决方案都是值得赞赏的。

好吧，你可以用price1和price2

if(document.getElementById('price2')) {
  var price2   = document.getElementById('price2').value;
}
else {
  var price2 = 0;
}

但是，既然我看到您使用jQuery，那么您应该使用jQuery的方式来实现Ajax。

相关文章：