Question

我正在使用JQuery滑块，它在我的标题中加载正常。我想它是用以下代码初始化的：

$(function() {
$( "#slider" ).slider({
orientation: "horizontal",
range: "min",
min: 0,
max: 100,
value: 60,
slide: function( event, ui ) {
$( "#amount" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider" ).slider( "value" ) );
});
$( ".selector" ).on( "slidecreate", function( event, ui ) {
} );

我正在调用一个Ajax函数，它使用标记

响应另一个JQuery滑块

<div id="slider"></div>

这是Ajax函数：

<!-- Ajax Function for removing an users favorites-->
function ShowFavoritesAjax(url,cfunc,userID)
{
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=cfunc;
xmlhttp.open("POST",url,true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("user_id=" + userID);
}


function ShowFavorites(userID)
{
ShowFavoritesAjax("ajaxPHP/users/ajaxShowFavorites.php",function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("userFav").innerHTML=xmlhttp.responseText; 
    } else { 
    document.getElementById("userFav").innerHTML='<img src="images/ajax-loader.gif">';
   }
  },userID,bandID);
}

所以我猜我需要在我的一个Ajax函数中“初始化Slider”。所以我通过修改返回来尝试这样做:(我只是在显示响应文本之前完全粘贴了初始化函数）

function ShowFavorites(userID)
{
ShowFavoritesAjax("ajaxPHP/users/ajaxShowFavorites.php",function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
 $(function() {
$( "#slider" ).slider({
orientation: "horizontal",
range: "min",
min: 0,
max: 100,
value: 60,
slide: function( event, ui ) {
$( "#amount" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider" ).slider( "value" ) );
});
$( ".selector" ).on( "slidecreate", function( event, ui ) {
} );
    document.getElementById("userFav").innerHTML=xmlhttp.responseText; 
    } else { 
    document.getElementById("userFav").innerHTML='<img src="images/ajax-loader.gif">';
   }
  },userID);
}

如果有人能发现我的问题而且有解决方法，我会非常感激。

感谢。

Answer 1

试试这个：

function ShowFavorites(userID)
{
   ShowFavoritesAjax("ajaxPHP/users/ajaxShowFavorites.php",function()
   {
         if (xmlhttp.readyState==4 && xmlhttp.status==200)
         {
             document.getElementById("userFav").innerHTML=xmlhttp.responseText; 
                $( "#slider" ).slider({
                    orientation: "horizontal",
                    range: "min",
                    min: 0,
                    max: 100,
                    value: 60,
                    slide: function( event, ui ) {
                          $( "#amount" ).val( ui.value );
                  });

              $( "#amount" ).val( $( "#slider" ).slider( "value" ) );

              $( ".selector" ).on( "slidecreate", function( event, ui ) {
              });
            } else { 
               document.getElementById("userFav").innerHTML='<img src="images/ajax-loader.gif">';
           }
  },userID);
}

我在此代码中所做的更改：

首先执行要执行的行document.getElementById("userFav").innerHTML=xmlhttp.responseText;。
删除$(function() {

原因：

$(function() {会触发（不是在这种情况下）。
当你执行像$ .slider这样的代码时，html没有插入到文档中但是=＆gt;所以你必须扭转秩序。

JQuery Slider在Ajax中初始化

1 个答案: