gpt4 book ai didi

javascript - 从下拉列表中选择不同类型的值打开不同类型的输入法?

转载 作者:行者123 更新时间:2023-11-30 15:10:06 25 4
gpt4 key购买 nike

如果用户从下拉列表中选择不同类型的值,我不知道如何编写 JavaScript 代码来更改输入类型方法,请帮助我。

例如

如果用户从下拉列表中选择标题、声明等,则简单的文本输入格式会在 HTML 下拉列表的前面打开

如果用户选择其他日期类型的 Application_date,则日期范围输入类型在 HTML 等下拉列表前面打开

请告诉我如何在 PHP 中将值存储在变量中 请帮忙

HTML代码

<select id="S1value" name="S1value" >
<option value="Claim" >Claim - C</option>
<option value="Title" >Title - T</option>
<option value="Description" >Description - D</option>
<option value="Abstract" >Abstract - A</option>
<option value="Application_No" >Application_Number -APN</option>
<option value="Priority_Number" >Priority_Number - PN</option>
<option value="Record_Number" >Record_Number - RN</option>
<option value="Priority_Date" >Priority_Date - PD</option>
<option value="Application_Date" >Application_Date -APD</option>
<option value="Publication_Date" >Publication_Date - PD</option>
<option value="US_Class">US_Class - USC</option>
<option value="IPC_Class">IPC_Class - IPC</option>
<option value="CPC_Class">CPC_Class - CPC</option>
<option value="Priority_Country_Code" >Priority Country Code - PCC</option>
<option value="Designate_States" >Designate_States - DS</option>
<option value="Legal_Status_Current" >Legal_Status_Current - LSC</option>
</select>

最佳答案

有一个自定义数据属性,它会告诉目标类型是什么

<!DOCTYPE html>
<html>
<head>
<title> Sample Code </title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<style>

</style>
</head>
<body>

<select id="S1value" name="S1value" onChange="createInput()" >
<option data-type="text" value="Claim" >Claim - C</option>
<option data-type="text" value="Title" >Title - T</option>
<option data-type="text" value="Description" >Description - D</option>
<option data-type="text" value="Abstract" >Abstract - A</option>
<option data-type="text" value="Application_No" >Application_Number - APN</option>
<option data-type="text" value="Priority_Number" >Priority_Number - PN</option>
<option data-type="text" value="Record_Number" >Record_Number - RN</option>
<option data-type="date" value="Priority_Date" >Priority_Date - PD</option>
<option data-type="date" value="Application_Date" >Application_Date - APD</option>
<option data-type="date" value="Publication_Date" >Publication_Date - PD</option>
<option data-type="text" value="US_Class" >US_Class - USC</option>
<option data-type="text" value="IPC_Class" >IPC_Class - IPC</option>
<option data-type="text" value="CPC_Class" >CPC_Class - CPC</option>
<option data-type="text" value="Priority_Country_Code" >Priority Country Code - PCC</option>
<option data-type="text" value="Designate_States" >Designate_States - DS</option>
<option data-type="text" value="Legal_Status_Current" >Legal_Status_Current - LSC</option>
</select>

<span id="inputElementWrapper" ></span>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
function createInput(){
var type = $('#S1value').find(':selected').data('type');
var input = document.createElement('input');
input.type=type;
input.name = "option";
$('#inputElementWrapper').html("");
$('#inputElementWrapper').append(input);
}
</script>
</body>
</html>

关于javascript - 从下拉列表中选择不同类型的值打开不同类型的输入法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45228900/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com