Если поле ввода содержит определенное количество символов

Question

<input type="text"/> <button>Go</button> 

<div id="example"> 
</div> 

Как я могу .append «скучное» в #example если input содержит 5 символов при button щелкают и .append «Другое», если он не хочет?

Answer 1

var example = $('#example'); //get example div 
var input = $('input').get(0); //get first input in the set of inputs 

$('button').click(function(){ //bind click handlers to (any) button 
    var value = input.value;  //get the (first) input's value 
    if(value.length === 5){  //check the value 
     example.append('Blah'); 
    } else { 
     example.append('Other'); 
    } 
}); 

Answer 2

$('button').click(function() { 
    var $example = $('#example'); 
    if ($('input').val().length == 5) { 
     $example.append('Blah'); 
    } else { 
     $example.append('Other'); 
    } 
}); 

http://jsfiddle.net/zerkms/cks45/

Answer 3

$(function(){ 
    $('button').click(function(){   
    if($('input').val().length == 5){ 
     $('#example').append('blah'); 
    }else{ 
     $('#example').append('Other'); 
    } 
    }); 
}); 

Answer 4

Pure JS способ

var butt = document.getElementsByTagName("button")[0], 
    input = document.getElementsByTagName("input")[0], 
    example = document.getElementById("example"); 

butt.onclick = function(){ 
    if(input.value.length == 5){ 
     example.textContent += "blah"; 
    }else{ 
     example.textContent += "other"; 
    } 
} 

Live Demo

Answer 5

$('button').on('click',function() { 
    $('#example').text(
     $('#example').text() + 
     ($('input[type=text]').val().length==5?'Blah':'Other') 
    ); 
}); 

Answer 6

Если вы не хотите использовать JQuery вы могли бы сделать ...

HTML

<input id="input1" type="text"/> <button onclick="go('input1')">Go</button> 

<div id="example"> 
</div> 

JavaScript

function go(inputId){ 
    document.getElementById("example").innerHTML += document.getElementById(inputId).value.length === 5 ? "bla" : "other"; 
} 

Это предполагало изменение HTML, чтобы включать в себя id для ввода и обработчик события onclick для кнопки.