Question

我在我的网站上实现了一个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);
    }
});

任何可能的解决方案都只是受到赞赏。

Answer 1

嗯，你可以用price1和price2

来做到这一点

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

但是既然我看到你使用jQuery，你应该使用jQuery方式来做Ajax。

由于缺乏输入，Ajax无法正常工作

1 个答案: