简体   繁体   English

同时选择+文本输入表单字段?

[英]select + text input form field at the same time?

How can I make my select be also an input form filed at the same time? 如何使我的选择同时成为输入表单?

I want it to have options for example 0.01 to 10.00 and to also make sure it has 2 decimals 我希望它具有例如0.01到10.00的选项,并确保它具有2个小数

How can I make it work in jquery? 我怎样才能使其在jquery中工作?

It sounds like you need a combobox with some validation. 听起来您需要具有一些验证的组合框。 Have a look at: http://jqueryui.com/autocomplete/#combobox 看看: http : //jqueryui.com/autocomplete/#combobox

您可能需要微调框而不是选择框: http : //jqueryui.com/spinner/#decimal

I can give you code which will select a option and auto generate a input type of textbox and insert the selected value to be used by the form . 我可以给您提供代码,该代码将选择一个选项并自动生成文本框的输入类型,并插入选定的值以供表单使用。 This is a tested code . 这是一个经过测试的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>test select</title>
   <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 

    <script>
        $(document).ready(function () {
            $('#pickValue').change(function () {
                var x =$(this).find('option:selected').text();
                if($('#myval').length == 0)
                    $('#showData').append('<input type="text" name="myval" id="myval" value="'+x+'" >');
                else
                    $('#myval').replaceWith('<input type="text" name="myval" id="myval" value="'+x+'" >');
            });
        });

    </script>
</head>
<body>
    <form action='xyz.php' method='get'>
        <div id='showData'>
            <select id='pickValue'>
                <option>Pick value</option>
                <option value='0.1'>0.1</option>
                <option value='0.2'>0.2</option>
                <option value='0.3'>0.3</option>
            </select>
        </div>
    </form>

</body>
</html>

I have attached full code you can use it as you wish to . 我已附上完整的代码,您可以根据需要使用它。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM