0

我已经为我的问题搜索了一个解决方案,我找到了这个: (jsfiddle 上的解决方案)。但是,我有 3 个不同的文本输入而不是单选按钮,我不知道该怎么做。有人可以帮帮我吗?提前致谢。

代码

<form action="/echo/json/1">
    <input type="submit" id="button1" value="Button 1" class="buttonGroupDependent" disabled/>
</form>
<form action="/echo/json/2">
    <input type="submit" id="button2" value="Button 2" class="buttonGroupDependent" disabled/>
</form>
<form action="/echo/json/3">
    <input type="submit" id="button3" value="Button 3" class="buttonGroupDependent" disabled/>
</form>

JS代码

$(document).ready(function(){
    $('input[name=buttonGroup]').change(function(){
        $('input.buttonGroupDependent').attr('disabled', true);
        $('#' + $(this).data().trigger).attr('disabled', false);
    });
});
4

3 回答 3

0

修改您引用的文章上的小提琴以适用于文本输入:http: //jsfiddle.net/dzWHe/

$(document).ready(function(){
    $('input[name=buttonGroup]').focus(function(){
        $('input.buttonGroupDependent').attr('disabled', true);
        $('#' + $(this).data().trigger).attr('disabled', false);
    });
});
于 2013-07-14T04:22:36.980 回答
0

使用onchange(编辑:见帖子底部)事件来响应文本框值的变化。将提交按钮默认禁用。

像这样的东西:

<form>
     <input type="text" id="text1" />
     <input type="submit" id="button1" />
</form>
<form>
     <input type="text" id="text2" />
     <input type="submit" id="button2" />
</form>    <form>
     <input type="text" id="text3" />
     <input type="submit" id="button3" />
</form>

JS:

$("#text1").on('keyup', function() {
    if($(this).val() === '') {
        $("#button1").attr("disabled", "disabled");
    } else {
        $("#button1").removeAttr("disabled");
    }
});
// repeat for other two

如果你想真正花哨,你可以使用一个类和一些 id 解析,如下所示:

$(".required").on('keyup', function() {
    if($(this).val() === '') {
        $("#button" + $(this).attr('id').substr(-1)).attr("disabled", "disabled");
    } else {
        $("#button" + $(this).attr('id').substr(-1)).removeAttr("disabled");
    }
});

编辑:change似乎只在离开文本框时触发;以前没用过这个事件,也许这是典型的。jsFiddle 与我的工作版本:http: //jsfiddle.net/64DC3/2/

编辑:应 OP 的要求添加:第二种 JS 方法的 HTML。

<form action="/echo/json/1">
    <input type="text" class="required" id="text1" />
    <input type="submit" id="button1" value="Button 1" disabled/>
</form>
<form action="/echo/json/2">
    <input type="text" class="required" id="text2" />
    <input type="submit" id="button2" value="Button 2" disabled/>
</form>
<form action="/echo/json/3">
    <input type="text" class="required" id="text3" />
    <input type="submit" id="button3" value="Button 3" disabled/>
</form>
于 2013-07-14T04:24:55.497 回答
0

你可以试试这个

$(document).ready(function(){
    $("input[type='text']").on('change', function(){
        if(this.value.length) $(this).closest('form').find('.buttonGroupDependent').attr('disabled', false);
        else $(this).closest('form').find('.buttonGroupDependent').attr('disabled', true);
    });
});

演示。

于 2013-07-14T04:26:17.173 回答