使用jquery输入值时更改选择值

时间:2014-01-03 04:08:15

标签: jquery html

HTML

<div class="form-group">
<label class="col-md-4 control-label">input price</label>
<div class="col-md-8">
    <input class="form-control" placeholder="price" id='price'>
    </div>
</div>
<div class="form-group">
    <label class="col-md-4 control-label">Range</label>
    <div class="col-md-8">
        <select class="form-control"  disabled="disabled" name='range'>
            <option value=1>150.000</option>
            <option>200.000</option>
            <option>250.000</option>
            <option>300.000</option>
            <option>350.000</option>
            <option>400.000</option>
            <option>450.000</option>
        </select>
    </div>
</div>

jQuery脚本:

<script>
$$(document).ready(function($){
    $("#price").mask("999.000");

    $("#price").on('keyup', function() {
        var price = $("#price").val();
        if(price <= 150000)
        {
            $('#range').val(150000);
        }
    });
});
</script>

大家好,我想做的是..当我写价格时(它有一个面具),所以只需要键入3个第一个数字,“。000”就会自动设置。因此,当一个数字是类型I时,检查输入的值,然后根据该价格值,我想更改作为选择的#range值。

选择被禁用原因它将根据价格中插入的值进行设置。 0-150000,150001-250000,250001-3500001 .. on and on

就像y类型DOG一样,自动选择将设置在动物

2 个答案:

答案 0 :(得分:1)

试试这个,

$(function () {
    $("#price").on('keyup', function () {
        var price = this.value; // use this.value instead of $("#precio").val();
        if (price <= 150000) {
            $('#range').val(150000);
        } else if (price>150000 && price <= 200000) {
            $('#range').val(200000);
        } else if (price>200000 && price <= 250000) {
            $('#range').val(250000);
        } else if (price>250000 && price <= 300000) {
            $('#range').val(300000);
        } else if (price>300000 && price <= 350000) {
            $('#range').val(350000);
        } else if (price>350000 && price <= 400000) {
           $('#range').val(400000);
        } else if (price>400000 && price <= 450000) {
            $('#range').val(450000);
        } 
    });
});

选项中添加value,例如

<select class="form-control"  disabled="disabled" name='range' id='range'>
    <option value="150000">150.000</option>
    <option value="200000">200.000</option>
    <option value="250000">250.000</option>
    <option value="300000">300.000</option>
    <option value="350000">350.000</option>
    <option value="400000">400.000</option>
    <option value="450000">450.000</option>
</select>

同时更改此行

$$(document).ready(function($){

$(document).ready(function(){

Working demo

答案 1 :(得分:1)

进行以下更正,在JS中您正在访问$("#precio").val();,但没有ID,因此请使用$("#price").val();

在文档准备中从 $(document).ready(function($){

中删除$

没有范围,因此$('#range').val(150000);选项的名称为范围但没有ID,因此请将名称更新为ID或使用$('select[name=range]')

在您的option字段中没有值,因此不会更新任何内容$('#range').val(200)

检查http://jsfiddle.net/raunakkathuria/JHm29/(我已经删除了演示的掩码功能,并且只根据您的要求将两个选项添加到所有选项中添加了值)