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

时间:2013-02-26 09:27:44

标签: php javascript jquery html

如何让我的选择同时也是一个输入表格?

我希望它有选项,例如0.01到10.00 并确保它有2位小数

如何在jquery中使其工作?

3 个答案:

答案 0 :(得分:3)

听起来你需要一个带有一些验证的组合框。看看:http://jqueryui.com/autocomplete/#combobox

答案 1 :(得分:1)

你可能想要一个微调器而不是一个选择框:http://jqueryui.com/spinner/#decimal

答案 2 :(得分:1)

我可以为您提供代码,该代码将选择一个选项并自动生成输入类型的文本框并插入要由表单使用的选定值。这是经过测试的代码。

<!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>

我附上了完整的代码,您可以根据需要使用它。