html可手动输入的下拉框(html 可输入的下拉框)
html5如何实现文本框下拉选项功能
可以使用HTML5 list 属性。list 属性需要应用到 input 框上,然后内容写一个自定义的 id
然后在任意位置放一对 datalist 标签,并给 datalist 框一个 id,和 list 属性指向的 id 一致即可。
在 datalist 标签下放列表项,每个列表项用 option 元标签来表示,option 标签里用 value 属性填写内容,label 属性来做提示。
下面是示例代码:
form action=""
input type="text" list="url_list" name="text" /
input type="submit" /
/form
datalist id="url_list"
option label="HZ赫兹工作室" value="" /
option label="提示1" value="列表项1" /
option label="提示2" value="列表项2" /
option label="" value="列表项3" /
/datalist
HTML5之前一般使用select标签或者div+js实现
html有一个下拉框,可以选择也可以输入,并且选择不同的值要改变img的路径,如何实现,我用sel
如果没有确认按钮,那就给input帮上mouseup事件,或者使用change事件。响应时获取input的value并且改变图片的src属性的值
HTML可输入编辑的下拉选择框怎么做
SCRIPT?LANGUAGE="JavaScript"
!--?Begin
function?catch_keydown(sel)
{
switch(event.keyCode)
{
case?13:
//Enter;
sel.options[sel.length]?=?new?Option("","",false,true);
event.returnValue?=?false;
break;
case?27:
//Esc;
alert("text:"?+?sel.options[sel.selectedIndex].text?+?",?value:"?+?sel.options[sel.selectedIndex].value?+?";");
event.returnValue?=?false;
break;
case?46:
//Delete;
if(confirm("Delete!?"))
{
sel.options[sel.selectedIndex]?=?null;
if(sel.length0)
{
sel.options[0].selected?=?true;
}
}
event.returnValue?=?false;
break;
case?8:
//Back?Space;
var?s?=?sel.options[sel.selectedIndex].text;
sel.options[sel.selectedIndex].text?=?s.substr(0,s.length-1);
event.returnValue?=?false;
break;
}
}
function?catch_press(sel)
{
sel.options[sel.selectedIndex].text?=?sel.options[sel.selectedIndex].text?+?String.fromCharCode(event.keyCode);
event.returnValue?=?false;
}
//End?--
/script
/head
select?size="1"?name="fh_cp"?onKeyDown="catch_keydown(this);"?onKeyPress="catch_press(this);"?style="font-size:12px;"
option/option
?if?($FH_CP""){
$seek_cp="select?gg,cp?from?bom?where?lh=\'$FH_CP\'?";
$result_cp=@pg_exec($link,$seek_cp);
$GG=trim(pg_result($result_cp,0,"gg"));
$CP=trim(pg_result($result_cp,0,"cp"));
$C_G=$CP.\'?\'.$GG;
echo?"option?selected?value=\\"$FH_CP\\"$C_G/option";?}?
?for($j=0;$j$row_fh;$j++){
$gg_fh=trim(pg_result($result_fh,$j,"gg"));
$cp_fh=trim(pg_result($result_fh,$j,"cp"));
$seek_lh="select?*?from?bom?where?cp=\'$cp_fh\'?and?gg=\'$gg_fh\'?";
$result_lh=pg_exec($link,$seek_lh);
$lh_fh=trim(pg_result($result_lh,0,"lh"));
$cp_gg=$cp_fh.\'?\'.$gg_fh;
if($lh_fh==$FH_CP){
echo?"option?selected?value=\\"$lh_fh\\"$cp_gg/option";
}
else{
echo?"option?value=\\"$lh_fh\\"$cp_gg/option";
}
}
?
/select
html中怎么可以使下拉框既可以选择也可以手动输入
select contenteditable="contenteditable"
option contenteditable="contenteditable"1312312/option
option contenteditable="contenteditable"12321313/option
/select