2010-12-07 2 views
0

У нас есть только два элемента формы. Они предназначены для чисел. Если numebrs совпадают (используя проверку), я хочу открыть панель слайдов (div).validate + listener + панель слайдов

Отсутствие кнопок или ссылок анкеров.

Проблемы, которые я нахожу, запускают панель, чтобы скользить вниз, после успеха второго совпадения поля. Я не хочу, чтобы пользователь щелкнул от второго поля ввода, а скорее слушал совпадение событий, это успех, после чего раскрывается div.

Если они не совпадают или пользователь изменяет входы, то div закрывается.

................... Так вот какой код.

<input id="mobile1" name="mobile1"> 
<input id="mobile2" name="mobile2"> 

Validation:

$(document).ready(function(){ 
    $("#form").validate({ 
     rules: { 
      mobile1: "required", 
      mobile2: { 
       equalTo: "#mobile1" 
      } 
     } 
    }); 
}); 

Slider, ну, кажется, множество различных версий мы можем использовать, тумблера и скользят как по JQuery весной на ум.

Моя проблема: я хочу, чтобы слушатель событий запускал панель слайдера со второго поля ввода. Без пользователя, чтобы щелкнуть что-нибудь в другом месте.

Так как они вводят второе поле ввода .. скоро, как он соответствует, «вживую» открывается ползунок.

Любая помощь приветствуется.

Ok с Davids Помощь, это то, что я до сих пор:

Validation:

$(document).ready(function(){ 
    $("#bugmeform").validate({ 
     rules: { 
      mobile1: "required", 
      mobile2: { 
       equalTo: "#mobile1" 
      } 
     } 
    }); 
}); 

JQuery Handler код Упоминание ниже

$("#mobile2").bind('keyup', "paste", function() { 
    if ($("#mobile1").val() == $("#mobile2").val()) { 
     $("#slider").animate({ 
      width: "70%", 
      opacity: 0.4, 
      marginLeft: "0.6in", 
      fontSize: "3em", 
      borderWidth: "10px" 
     }, 1500); 
    }); 

элемент формы выглядит следующим образом: Mobile 1

<input id="mobile1" name="mobile1" class="small" size="12" type="text" onkeydown="return (event.ctrlKey || event.altKey 
       || (47<event.keyCode && event.keyCode<58 && event.shiftKey==false) 
       || (95<event.keyCode && event.keyCode<106) 
       || (event.keyCode==8) || (event.keyCode==9) 
       || (event.keyCode>34 && event.keyCode<40) 
       || (event.keyCode==46))" 
       class="medium" onKeyPress="return numbersonly(event, false)" onKeyDown="limitText(this.form.mobile1,this.form,10);" 

onKeyUp = "limitText (this.form.mobile1, this.form, 10);" MaxLength = "10" />

Мобильный 2

<input id="mobile2" name="mobile2" class="small" size="12" type="text" onkeydown="return (event.ctrlKey || event.altKey 
       || (47<event.keyCode && event.keyCode<58 && event.shiftKey==false) 
       || (95<event.keyCode && event.keyCode<106) 
       || (event.keyCode==8) || (event.keyCode==9) 
       || (event.keyCode>34 && event.keyCode<40) 
       || (event.keyCode==46))" 
       class="medium" onKeyPress="return numbersonly(event, false)" onKeyDown="limitText(this.form.mobile2,this.form,10);" 

OnKeyUp = "limitText (this.form.mobile2, this.form, 10);" MaxLength = "10" />

Div элемент Я хочу анимировать:

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

привет мир </DIV>

Thats об этом.

ответ

1

Возможно, что-то вроде:

$('#secondInput').keyup(
    function(){ 
     if ($('#firstInput').val() == $('#secondInput').val()) { 
      $('#slider').animate({/* slide into view */}, 500); 
     } 
    }); 
+0

Привет Давид, спасибо за ответ.Это выглядит так, как будто это сработает, keyup запустит слайдер при успешном использовании, не будет скользить каждый раз, когда нажата клавиша lol – 422 2010-12-07 22:37:04