我有两个文本字段,每当我在第一个字母中写一个数字时,它应该在第二个字段上给我它的名字。
假设我在“第一个”字段上写了11,那么它应该自动将字 '11'(非数字本身)放在“第二个”字段上。任何数字都是一样的。
我知道这可以用jQuery完成,但我只是不知道如何。 有什么建议??
答案 0 :(得分:3)
$(function() {
$('.input').bind('keyup',function() {
$('.output').val($(this).val());
});
});
您可以在此处进行测试 http://jsbin.com/owani3
答案 1 :(得分:1)
这应该做的工作
$('#f1').live('keyup', function(){
$('#f2').val($(this).val())
})
检查工作演示:http://jsfiddle.net/E44Un/
答案 2 :(得分:1)
对于任意数量的文本框,这应该有效:
$(".syn").live("keyup", function() {
var self = $(this);
$(".syn").each(function() {
$(this).val(self.val());
});
})
只需将一个班级syn
添加到您的文字输入
答案 3 :(得分:1)
要关联两个字符串,最简单的方法是使用一个对象来创建一个字典/地图,如下所示;
$('#input1').bind('keyup',function() {
var map = {
"1":"One",
"2":"Fish",
"3":"Bar"
};
$('#input2').val(map[$(this).val()]);
});
您可以在此处查看此操作:http://www.jsfiddle.net/dCy6f/
更高级的行为:
$('#input1').bind('keyup',function() {
var str = '';
var input = $(this).val();
var intVal = parseInt(input, 10); // Dont forget the radix
var map = {
"1":"One",
"2":"Fish",
"3":"Bar"
};
if (intVal > 50 && intVal < 100) {
str = 'Something';
} else if (map.hasOwnProperty(input)) {
str = map[input];
}
$('#input2').val(str);
});
您可以在此处测试此实施:http://www.jsfiddle.net/H6skz/
如果您希望仅在用户输入第一个输入字段时更新第二个值,请将“keyup”更改为“更改”。
要将其抽象为函数,您可以这样做:
function relate(me, withMe) {
$(me).bind('keyup',function() {
var str = '';
var input = $(this).val();
var intVal = parseInt(input, 10); // Dont forget the radix
var map = {
"1":"One",
"2":"Fish",
"3":"Bar"
};
if (intVal > 50 && intVal < 100) {
str = 'Something';
} else if (map.hasOwnProperty(input)) {
str = map[input];
}
$(withMe).val(str);
});
}
然后按如下方式使用它:
relate('#input1', '#input2');
要获得更直观的界面,请编写一个jQuery插件:
(function ($) {
jQuery.fn.relate = function (withMe) {
this.bind('keyup',function() {
var str = '';
var input = $(this).val();
var intVal = parseInt(input, 10); // Dont forget the radix
var map = {
"1":"One",
"2":"Fish",
"3":"Bar"
};
if (intVal > 50 && intVal < 100) {
str = 'Something';
} else if (map.hasOwnProperty(input)) {
str = map[input];
}
$(withMe).val(str);
});
};
}(jQuery));
然后使用如下:
$('#input1').relate('#input2');