양식에서 jQuery 슬라이더 범위를 사용하는 방법은 무엇입니까?

jQuery slider range을 양식에 사용하는 데 어려움이 있습니다.양식에서 jQuery 슬라이더 범위를 사용하는 방법은 무엇입니까?

form.php

<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>jQuery UI Slider - Range slider</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css" /> 
    <script> 
    $(function() { 
    $("#slider-range").slider({ 
     range: true, 
     min: 0, 
     max: 500, 
     values: [ 75, 300 ], 
     slide: function(event, ui) { 
     $("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]); 
     } 
    }); 
    $("#amount").val("$" + $("#slider-range").slider("values", 0) + 
     " - $" + $("#slider-range").slider("values", 1)); 
    }); 
    </script> 
</head> 

<body> 

<form action="welcome.php" method="post"> 
Name: <input type="text" name="name"><br> 
E-mail: <input type="text" name="email"><br> 
<label for="amount">Age range:</label> 
    <input type="text" id="amount" name="agerange" style="border: 0; color: #f6931f; font-weight: bold; " /> 
</p> 
<div id="slider-range""></div> 

<input type="submit"> 
</form> 

</body> 
</html>

welcome.php

<html> 
<body> 

Welcome <?php echo $_POST["name"]; ?><br> 
Your email address is: <?php echo $_POST["email"]; ?> 
Your age range is: <?php echo $_POST["agerange"]; ?> 
</body> 
</html>

슬라이더가 제대로 그러나 양식 반환 값을 보여줍니다 : 나는 간단한 형태 (원래 here에서) 프로세서를 사용 테스트하려면 연령대. 이 값을 양식 처리 스크립트에서 사용할 수 있도록 반환하는 값이 확실하지 않습니다. 힌트를 높이십시오

출처

2013-10-31 supermario

게시자가 결과를 얻는 지 확실하지 않은 경우 ... 이와 같은 경우 : agerange = % 2475 + - + % 24300? (내 로컬 웹에서 시도한) .. 당신 urldecode ($ _ POST [ "agerange"])를 사용할 수 있습니다; ... – lollo

결과 환영 페이지에 문자열이 표시되지 않습니다. 즉, '귀하의 연령대는 다음과 같습니다.' – supermario

Tamper Data 또는 Firebug (firefox)와 같은 디버그 도구를 사용합니까? .. 또한 당신이 너무 많이 따옴표를 가지고

라인에 오타를 수정해야합니다 :

– lollo

나이와 함께 작업하고 있으므로 범위 값에서 달러 기호를 제거해야합니다. 이 두 사람과 함께

$("#amount").val("$" + $("#slider-range").slider("values", 0) + 
    " - $" + $("#slider-range").slider("values", 1));

:이와

$("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]);

$("#amount").val(ui.values[ 0 ] + " - " + ui.values[ 1 ]);

이 두 줄이 줄을 교체

$("#amount").val($("#slider-range").slider("values", 0) + 
    " - " + $("#slider-range").slider("values", 1));

지금 당신은이 문자열을 가지고 $ _POST [ "ageran ge "] (가정 해 봅시다) :"35 + - + 75 " ("+ "는 게시물을 보낼 때 PHP가 사용하는 공간을 대신합니다)

따라서 explode() 함수를 사용하여 배열을 구할 수 있습니다 다음과 같이 두 가지 값이 있습니다.

<?php 
$range = explode(' - ', $_POST['agerange']); 
?> 
<html> 
<body> 
Welcome <?php echo $_POST["name"]; ?><br> 
Your email address is: <?php echo $_POST["email"]; ?> 
Minimum age in your range is: <?php echo $range[0]; ?><br /> 
....and maximum is: <?php echo $range[1]; ?><br /> 
</body> 
</html>

출처

2013-11-01 17:13:45 lollo

이 경우에도 적용되지만 양식 내부에는 쉽게 슬라이더가 구현되어 있는지 확실하지 않습니다. numericToGrade() 기능 내가 편지 등급에 숫자 값 (이 경우 0-4)으로 변환하는 데 사용 뭔가 것을

» »주 (F, DA) : 저는 여기에 사용되는 단순화 된 코드입니다 . 은 스크립트가 작동하는 방식에 영향을주지 않습니다. 페이지 먼저 Google 크롬 내지 제 피검 (생성 된) 코드 : 여기서

<html> <head> <link href="../css/smoothness/jquery-ui-1.10.4.custom.css" rel="stylesheet"> <script src="../js/jquery-1.10.2.js"></script> <script src="../js/jquery-ui-1.10.4.custom.min.js"></script> <script type="text/javascript"> // OPTIONAL: If there are other versions of jQuery running on the site, // this will ensure proper script operation. 'NC()' replaces '$()'. var NC = jQuery.noConflict(); NC(function() { NC("#slider").slider({ value:3, max: 4, slide: function(event, ui) { NC("#grade").val(numericToGrade(ui.value)); NC("#gradedisp").html(numericToGrade(ui.value)); }}); var val = NC("#slider").slider("value"); NC("#grade").val(numericToGrade(val)); NC("#gradedisp").html(numericToGrade(val)); }); function numericToGrade(num) { switch (num) { case 0: return "F"; break; case 1: return "D"; break; case 2: return "C"; break; case 3: return "B"; break; case 4: return "A"; break; default: return "err"; } } </script> </head> <body> <form action="submit.php" method="POST"> <label for="slider">Grade Us:</label> <span id="gradedisp"></span> <span id="slider"></span> <input type="hidden" id="grade" name="rating" /> </form> </body> </html>

« «

은 두 스크린 샷이다 Front-End View

때 슬라이더 ' 슬라이드 '라고하면이 일이 발생합니다. 디스플레이 요소 (<span id="gradedisp">)와 숨겨진 입력 요소 (<input type="hidden" id="grade" name="rating">) 모두 업데이트 된 다원적으로 이것은 초기 디버깅/최종 출력에 유용합니다. <span> 태그 당신이 <input> 태그처럼 .html 대신 .val를 사용하는 데 필요한

주 사용합니다.양식이 제출 될 때

마지막으로, PHP는 단순히이 코드를 사용하여 슬라이더의 값을 잡을 수 있습니다

$rating = $_POST['rating'];

희망이 도움이!

출처

2014-06-19 18:19:47 Anders

양식에서 jQuery 슬라이더 범위를 사용하는 방법은 무엇입니까?

답변

관련 문제