卡在使用 JQuery 有条件地启用或禁用输入上

发布于 2024-09-05 03:07:46 字数 563 浏览 5 评论 0原文

我正在尝试根据变量的值有条件地启用或禁用 HTML 输入。 “禁用”部分运行良好，但“启用”部分则不然，我不明白为什么。

代码：

<--if variable is true...-->
<div id="disabledSearch" class="searchBox disabled">
    <script type="text/javascript">
        $('#disabledSearch :input').attr('disabled', true); 
    </script>

<--if variable is false-->
<div id="enabledSearch" class="searchBox">
    <script type="text/javascript">
        //This line isn't working:  
        $('#enabledSearch :input').removeAttr('disabled');
    </script>

原文

I am attempting to conditionally enable or disable HTML input based on the value of a variable. The "disable" part is working well, but the "enable" isn't, and I can't figure out why.

The code:

<--if variable is true...-->
<div id="disabledSearch" class="searchBox disabled">
    <script type="text/javascript">
        $('#disabledSearch :input').attr('disabled', true); 
    </script>

<--if variable is false-->
<div id="enabledSearch" class="searchBox">
    <script type="text/javascript">
        //This line isn't working:  
        $('#enabledSearch :input').removeAttr('disabled');
    </script>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

海拔太高太耀眼 2024-09-12 03:07:46

我玩了一下这个 - 查看 http://jsbin.com/ayoye3

input .attr('disabled',true) 和 input.attr('disabled',false) 成功切换输入。

唯一的可能性是您没有选择正确的元素，因此代码似乎不起作用。确保您的选择器选择正确的节点，或者在此处共享更多代码 - 您可能需要将函数放在 $(function() { ... }) 包装器中，以确保它们仅DOM 加载后执行。

另外，您是否遇到任何与 js 相关的浏览器错误？

回复收藏 0 原文

尾戒 2024-09-12 03:07:46

而不是删除属性
尝试

$('#enabledSearch :input').attr('disabled', false);

注意：只是一个建议，但您可能应该在 $(document).ready() 函数中执行此操作。这将清理您拥有的一些重复代码。

已编辑

查看将代码迁移到 $(document).ready( function() {});并使用 $.toggle() 函数根据条件在输入上切换禁用状态。请注意，如果仅在服务器端引用该条件，您可以通过将其放置在隐藏输入中来在客户端公开该标志。

就我个人而言，假设您在 div 下确实有有效的输入，我会做类似的事情

<div id="searchDiv" class="searchBox <%=SearchIsDisabled ? "disabled" : "enabled"%>"> 
    <input name="myinput" value="" type="text" />
</div>

<script type="text/javascript"> 
        $(document).ready(function () {
           $("#searchDiv.disabled input).attr('disabled', true);
           $("#searchDiv.enabled input).attr('disabled', false);
        })
</script>

instead of removeAttr
try

$('#enabledSearch :input').attr('disabled', false);

Note: just a suggestion but you should probably do this in the $(document).ready() function. this would clean up some of the duplicate code that you have.

Edited

Look at migrating the code to $(document).ready( function() {}); and using the $.toggle() function to toggle disabled on the input depending on the condition. Note if the condition is only referenced on the server side you can expose the flag on the client side by placing it in a hidden input.

Personally I would do something like this assuming you do have a valid input under the div

<div id="searchDiv" class="searchBox <%=SearchIsDisabled ? "disabled" : "enabled"%>"> 
    <input name="myinput" value="" type="text" />
</div>

<script type="text/javascript"> 
        $(document).ready(function () {
           $("#searchDiv.disabled input).attr('disabled', true);
           $("#searchDiv.enabled input).attr('disabled', false);
        })
</script>

回复收藏 0 原文