2013-05-14 2 views
-3

HTML:Заменить текст в JQuery

<textarea></textarea><br /> 
<a href="#">Generate</a> 

<span id="output"></span> 

JQuery:

$('textarea').bind('keypress', function(event) { 
    var charCode = event.which; 
    var keyChar = String.fromCharCode(charCode); 
    return /[a-zA-Z ]/.test(keyChar); 
}); 

var replacements = { 
    'a': '1', 
    'b': '2', 
    'c': '3' 
} 

$('a').click(function() { 
    $('textarea').val(function(i, val) { 
     val = val.split(''); 

     $.each(val, function(i, e) { 
      val[i] = replacements[e] ? replacements[e] : e; 
     }); 

     return val.join(''); 
    }); 
    return false; 
}); 

http://jsfiddle.net/sta75/


Как я могу изменить этот существующий код для отображения замены в $('span#output');? И как побочный вопрос, какие изменения могут быть сделаны, чтобы сделать этот код более эффективным?

ответ

1

Вот решение для отображения замены в #output:

$('textarea').bind('keypress', function(event) {  
    return /[a-zA-Z ]/.test(String.fromCharCode(event.which)); 
}); 

var replacements = { 
    'a': '1', 
    'b': '2', 
    'c': '3' 
} 

$('a').on('click', function(e) { 
    e.preventDefault(); 
    val = $('textarea').val().split('');  
    $.each(val, function(i, e) { 
     val[i] = replacements[e] ? replacements[e] : e; 
    }); 
    $('#output').html(val.join('')) ;  
}); 

http://jsfiddle.net/sta75/1/

1

Вместо того чтобы делать:

return val.join(''); 

Do:.

$('span#output').html(val.join('')); 
0

Просто добавьте $ ('# выход') HTML (. $ ('Текстовое поле') Вал());

$('a').click(function() { 
$('textarea').val(function(i, val) { 
    val = val.split(''); 

    $.each(val, function(i, e) { 
     val[i] = replacements[e] ? replacements[e] : e; 
    }); 

    return val.join(''); 
}); 
$('#output').html($('textarea').val()); //here 
return false; 

});

Смежные вопросы