在jquery中使用checkbox控件标签的隐藏和显示

最新推荐文章于 2024-07-17 23:34:52 发布

xiaodan_0721

最新推荐文章于 2024-07-17 23:34:52 发布

阅读量1.9k

点赞数

文章标签： jquery checkbox 控件

本文链接：https://blog.csdn.net/xiaodan_0721/article/details/48545851

版权

如图所示，当选中checkbox时，显示文本输入框，并使下拉框不可用；

当取消选中checkbox时，文本框隐藏，下拉框可用

代码如下：

<script src="js/jquery-1.9.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            
        })
        function changeState() {


            if ($("#chkInputNew").is(':checked')) {
                $("#sNew").show();
                $("#selProductName").attr("disabled", true);
            }
            else {
                $("#sNew").hide();
                $("#selProductName").attr("disabled", false);
            }
        }
    </script>

<select id="selProductName">
                    </select>
                    <input type="checkbox" id="chkInputNew" οnclick="javascript:changeState();" />
                    请输入新品名<span id="sNew" style="display: none"><input type="text" id="txtNewName" name="txtNewName" /></span>