如果使用文本字段，如何禁用文件输入

Question

如果使用特定文本输入，我需要禁用文件输入。或者，如果使用文件输入，则禁用文本输入。但是，如果最终用户改变主意，那么我希望能够在文本输入为空时启用文件输入，反之亦然。

如果使用文本输入，这可以很好地禁用文件输入。但是，如果我清除文本输入，文件输入将保持禁用状态：

    $("#linkurl").on('keyup blur', function(){
        $('#link').attr('disabled', this.value.trim().length);
    });

我尝试过这个，但显然不起作用：

    $("#linkurl").on('keyup blur', function(){
        if($.trim($("#linkurl").val()) === ''){
            $('#link').attr('disabled');
        }else{
            $('#link').removeAttr('disabled');
        }
    });

这是我的 HTML：

<form action="default.cfm" method="post" enctype="multipart/form-data" id="linkform">
<div id="formdiv">

    <strong style="color: #ff0000;">Linked Text</strong>: Enter the text you wish to display for the link.<br/>
    <strong style="color: #ff0000;">URL</strong>: Enter a URL if you wish to link to another website (include: http://).<br/>
    <strong style="color: #ff0000;">PDF:</strong> The PDF file you wish to upload.<br/><br/>

    <strong style="color: #ff0000;">Linked Text:</strong><br/>
    <input type="text" name="linktext" id="linktext" required><br/><br/>
    <strong style="color: #ff0000;">URL:</strong><br/>
    <input type="text" name="linkurl" id="linkurl" value="If link, enter here..." required><br/><br/>
    <strong style="color: #ff0000;">PDF:</strong><br/>
    <input type="file" name="link" id="link" required>

</div>

<div id="submitbox"><input type="submit" value="Click to Create Link" id="updatebutton"></div>

我的头的一侧完全秃了，因为我把头发扯下来了。如果有更好的方法，我愿意接受建议......

谢谢...

Answer 1

请将以下代码更改为：

来自

$("#linkurl").on('keyup blur', function(){
          if($.trim($("#linkurl").val())){
            $('#link').attr("disabled", "disabled");
        }else{$('#link').removeAttr('disabled');}
    });

至

$("#link").on("change", function(){
          if($.trim($("#link").val())){
            $('#linkurl').attr("disabled", "disabled");
        }else{$('#linkurl').removeAttr('disabled');}
    });

jsfiddle

Answer 2

HTML

<!--html part -->
<input type="text" id="vurl" />
<input type="text" id="yurl" />
<input type="file" id="video" />

JS

$("#vurl").on('keyup blur', function(){
  if($.trim($("#vurl").val())){
    $('#video').attr("disabled", "disabled");
}else{$('#video').removeAttr('disabled');}
});
$("#yurl").on('keyup blur', function(){
  if($.trim($("#yurl").val())){
    $('#video').attr("disabled", "disabled");
  }else{$('#video').removeAttr('disabled');}
});

$("#video").on("change", function(){
  if($.trim($("#video").val())){
    $('#vurl').attr("disabled", "disabled");
    $('#yurl').attr("disabled", "disabled");
  }else{
    $('#vurl').removeAttr('disabled');
    $('#yurl').removeAttr('disabled');
  }
});

Answer 3

为什么不使用 length 属性来查看输入是否为空？

例如：

 $("#linkurl").on('keyup blur', function(e){
    if($(this).val().length == 0){
        $('#link').attr('disabled');
    }else{
        $('#link').removeAttr('disabled');
    }
 });

Answer 4

这应该适合你：

$('#linkurl').on('keyup blur', function () {
    'use strict';
    if ($.trim($('#linkurl').val())) {
        // The field is not empty

        $('#link').prop('disabled', true);
    } else {
        $('#link').prop('disabled', false);
    }
});

这是一个JSFiddle。

Answer 5

$("#linkurl").on('keyup blur', function(e){
    if(trim($(this).val())==''){
        $('#link').attr('disabled');
    }else{
        $('#link').removeAttr('disabled');
    }
 });

Answer 6

试试这个，我认为如果#linkurl中有一些值，那么你的if条件也是错误的，那么你想禁用#link，否则启用它吧

$("#linkurl").on('keyup', function(){
        if($.trim($(this).val()).length == 0){
            $('#link').removeAttr('disabled');
         }else{
          $('#link').attr('disabled','disabled');   
        }
    });

http://jsfiddle.net/pfALM/1/