JS取 Input 控件值方法

时间:2024-03-06 07:41:16

最近经常用到Input 控件,在不同场景用JS去取Input的value的方式是不同的,以下是我暂时想到的几种方式,欢迎收藏补充,为以后开发省时。

<html>
    <header>
        <title>index</title>
        <script src="jquery-3.1.1.min.js"></script>
    </header>

    <body>
        <div>
            <!-- 简单绑定单击方法,其他事件一样处理 -->
            <input id="id_1" class="id_1" value="啦啦啦" name="李丽" sid="sid_1" data-s="lili" onclick="funClick(this)" />            
        </div>

    </body>
    <script>
        function funClick(obj)
        {
            var data = $(obj).attr("data-s");

            var inputVal = $("#id_1").val();
            
            //可以使用任意属性获取,套格式
            var inputVal2 = $("input[sid=\'sid_1\']").val();
            
            var inputVal3 = obj.value;

            var inputVal4 = document.getElementById("id_1").value;

            console.log("inputVal:"+inputVal + ",inputVal2:" + inputVal2 + ",inputVal3:" + inputVal3 + ",inputVal4:" + inputVal4);
            //inputVal:啦啦啦,inputVal2:啦啦啦,inputVal3:啦啦啦,inputVal4:啦啦啦
        }
    
    </script>
</html>

在这里插入图片描述
如有其它方法欢迎补充~

相关文章