我想有一个表单,其中将有一对夫妇的输入,例如:名称和URL。当用户输入他们的名字时,我希望url输入自动将他们的名字作为默认值,并在单词之间加上下划线,所以如果他们输入的是他们的名字pedro kinkybottom,那么url输入中自动设置的默认值将是pedro_kinkybottom。我使用cakephp,如果有人碰巧知道一个特别cakey的方法来做这件事,这将是很酷的,但否则任何帮助都将是最受欢迎的。
l7mqbcuq1#
你可能想用JavaScript而不是PHP来做这件事,尽管你可能更熟悉PHP,但使用JavaScript的用户体验会更好,整体设计也会更简单(因为页面不需要刷新)。您基本上需要做两件事:1.设置输入的值以响应另一个输入上的事件。1.将空格字符替换为下划线字符。第二部分,看看JavaScript的replace函数。它非常健壮,允许你做很多字符串操作。绝对值得你自己尝试一下。对于第一部分,下面是jQuery的示例:
$('#inputName').change(function() { $('#inputURL').val($('#inputName').val()); });
这会在inputName的值发生变化时将inputURL的值设置为inputName的值,对于字符串替换,您可以将其修改如下:
inputName
inputURL
$('#inputName').change(function() { $('#inputURL').val($('#inputName').val().replace(' ', '_')); });
注意当控件失去焦点时change事件将被触发。如果你想在你输入时发生,那么尝试keyup事件。还有other events事件。
change
keyup
tjjdgumg2#
将keyup事件添加到name字段,该事件将更新url字段:
<form> <input type="text" id="name" /> <input type="text" id="url" /> </form>
......以及日本:
addEvent(document.getElementById('name'), 'keyup', function () { document.getElementById('url').value = this.value.replace(' ', '_'); }); function addEvent(ele, evnt, funct) { if (ele.addEventListener) // W3C return ele.addEventListener(evnt,funct,false); else if (ele.attachEvent) // IE return ele.attachEvent("on"+evnt,funct); }
http://jsfiddle.net/XKEh5/如果你只想做一些琐碎的事情,那么你可以使用普通的javascript,如果你想做很多这样的事情,再加上一些效果,比如淡出元素或诸如此类的东西,我建议你看看mootools或jQuery。
sigwle7e3#
下面是上面答案的编辑版本。"value.replace(' ', '_');"有一个问题,它只会删除输入的前两个单词之间的空格。下面的代码片段可以解决所有问题。
"value.replace(' ', '_');"
<script language="javascript" type="text/javascript"> addEvent(document.getElementById('name'), 'keyup', function () { document.getElementById('url').value = this.value.split(' ').join(''); }); function addEvent(ele, evnt, funct) { if (ele.addEventListener) // W3C return ele.addEventListener(evnt,funct,false); else if (ele.attachEvent) // IE return ele.attachEvent("on"+evnt,funct); } </script>
3条答案
按热度按时间l7mqbcuq1#
你可能想用JavaScript而不是PHP来做这件事,尽管你可能更熟悉PHP,但使用JavaScript的用户体验会更好,整体设计也会更简单(因为页面不需要刷新)。
您基本上需要做两件事:
1.设置输入的值以响应另一个输入上的事件。
1.将空格字符替换为下划线字符。
第二部分,看看JavaScript的replace函数。它非常健壮,允许你做很多字符串操作。绝对值得你自己尝试一下。
对于第一部分,下面是jQuery的示例:
这会在
inputName
的值发生变化时将inputURL
的值设置为inputName
的值,对于字符串替换,您可以将其修改如下:注意当控件失去焦点时
change
事件将被触发。如果你想在你输入时发生,那么尝试keyup
事件。还有other events事件。tjjdgumg2#
将keyup事件添加到name字段,该事件将更新url字段:
......以及日本:
http://jsfiddle.net/XKEh5/
如果你只想做一些琐碎的事情,那么你可以使用普通的javascript,如果你想做很多这样的事情,再加上一些效果,比如淡出元素或诸如此类的东西,我建议你看看mootools或jQuery。
sigwle7e3#
下面是上面答案的编辑版本。
"value.replace(' ', '_');"
有一个问题,它只会删除输入的前两个单词之间的空格。下面的代码片段可以解决所有问题。