別の隠しフィールドに表示されるスライダの値を取得する方法は？ここで

は、上記のコードは、2つのスライダを生成別の隠しフィールドに表示されるスライダの値を取得する方法は？ここで

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Papermashup.com | jQuery UI Slider Demo</title> 
<link href="../style.css" rel="stylesheet" type="text/css" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> 
     <style type="text/css"> 
#container{ 
background:url(bg.jpg)!important; 
padding:100px 50px 0px 50px; 
} 

/*the slider background*/ 
.slider { 
width:230px; 
height:11px; 
background:url(slider-bg.png); 
position:relative; 
margin:0; 
padding:0 10px; 
} 

/*Style for the slider button*/ 
.ui-slider-handle { 
width:24px; 
height:24px; 
position:absolute; 
top:-7px; 
margin-left:-12px; 
z-index:200; 
background:url(slider-button.png); 
} 

/*Result div where the slider value is displayed*/ 
#slider-result { 
font-size:50px; 
height:200px; 
font-family:Arial, Helvetica, sans-serif; 
color:#fff; 
width:250px; 
text-align:center; 
text-shadow:0 1px 1px #000; 
font-weight:700; 
padding:20px 0; 
} 

/*This is the fill bar colour*/ 
.ui-widget-header { 
background:url(fill.png) no-repeat left; 
height:8px; 
left:1px; 
top:1px; 
position:absolute; 
} 

a { 
outline:none; 
-moz-outline-style:none; 
} 


     </style> 

     <script type="text/javascript"> 
     $('document').ready(function(){ 
      $('#submit').click(function(){ 

var username=$('#hidden').val(); 
if(username=="") 
username = 50; 
$.post('comment.php',{hidden:username},function(return_data){ 
alert(return_data); 
}); 
}); 
}); 
     </script> 
</head> 
<body> 



     <div class="slider" id="one"></div> 
     <div class="slider" id="two"></div> 
     <div id="slider-result"></div> 
     <form> 
<input type="hidden" id="hidden1"/> 

<input type="hidden" id="hidden2"/> 

<input type="button" id="submit" value="submit"/> 
</form> 


      <script> 

       $(".slider").slider({ 
       animate: true, 
       range: "min", 
       value: 50, 
       min: 10, 
       max: 100, 
       step: 10, 

       //this updates the hidden form field so we can submit the data using a form 
       slide: function(event, ui) { 

       $("#slider-result").html(ui.value); 
$("#one").click(function(){ 
       $('#hidden1').attr('value', ui.value);}); 
$("#two").click(function(){ 
       $('#hidden2').attr('value', ui.value);}); 
       } 
       }); 


     </script> 



</body> 
</html>

.......コードです。スライダーをクリックすると、値は隠しフィールド...に表示されますが、最初のスライダーをクリックすると2つのスライダーが作成され、値は「hidden1」に正しく表示されます。 2番目のスライダーをクリックすると、値は "hidden1"に表示され、 "hidden2"には表示されません。何がpbmになるかもしれません。私はいろいろ試しましたが、それを理解できませんでしたか？

出典

2011-06-23 error

私は、これはあなたが

http://jsfiddle.net/bU6EV/12/

が戻ったばかりの隠し入力フィールドを変更し、CSSでのバックグラウンド値をリセットしたいものだと思います。

出典

2011-06-23 18:04:35 Colin

これが問題なのかどうかはわかりません。 jquery valを使用してattrの代わりに値を設定できます。

$("#Hidden1").val(ui.value);

スライド機能内でClickイベントを設定する理由がわかりません。スライドイベントの外でクリックイベントを設定したいと思うようです。

IDを取得する方法がわからない場合は、$（これ）が動作すると思います。

slide: function(event, ui) { 
    if($(this).attr("id") == "#Hidden1") 
    { $("#Hidden1").val(ui.value); } 
    else 
    {$("#Hidden2").val(ui.value);} 
});

両方のスライダに1つのスライド機能を設定します。どの機能が使用されたのかを知る必要があります。たぶんあなたはclickイベントで何をしようとしていたのでしょうか？

出典

2011-06-23 17:54:31

私はあなたがいなくて、クリックイベントは必要ないと思っています。 –

お返事ありがとうございました.......... – error

なぜ$（ "＃hidden1"）を使用しないのですか？val（ui.value）; ？

あなたが他の方法で同様

何かスライダーを作成する必要があります。私の悪い英語のための

$(".slider").each(
    $(this).slider({ 
     .... 
    }); 
);

申し訳ありませんが！

出典

2011-06-23 18:05:22 imaginabit

お返事ありがとうございました.......... – error

別の隠しフィールドに表示されるスライダの値を取得する方法は？ここで

答えて

関連する問題