HTML 如何获取输入框的值

最新推荐文章于 2025-02-15 00:23:42 发布

CherryChen88

最新推荐文章于 2025-02-15 00:23:42 发布

阅读量8.9w

点赞数 24

分类专栏： webview 文章标签： android html

本文链接：https://blog.youkuaiyun.com/ONLYMETAGAIN/article/details/78899867

版权

webview 专栏收录该内容

4 篇文章

订阅专栏

前沿

非常非常久的时间没有写html了，一直做原生混合html的开发，很多时候都需要自己写一个html页面，然后调用android中写的js方法进行测试，最近在研究返利网的返利模式，需要自己写一个html，有一个输入框，然后获取到输入框的值，进行安装判断，然后跳转，很久没写，html都不会写了，下面是存着方便后期自己忘记的时候再次使用。

1.如何写一个输入框

//依稀来记得之前老师说的，id唯一，name不唯一
<input id="data" type="text" name="name" />

2.写一个button用于获取值

<input type="submit" value="测试"  onclick="test()"/>

其中value为显示的值类似 android:text=”测试“

type=”submit” 就是提交按钮

οnclick=“test（）” 点击事件

3.如何获取输入框的值

1)没有导入jquery的情况下

        //测试
        function test(){
           //获取 输入框的值
           alert(document.getElementById("data").value);
        }

2)导入了jqery的情况下

    //测试
    function test(){
     alert($('#data').value);
    }

4.整体代码

因为当中含有很多自己正在测试的代码，提取自己需要的就好

<html>
<head>
    <title>测试</title>
    <script type="text/javascript">
       function btnAction()
        {
           //dd="intent://platformapi/startapp?saId=10000007&clientVersion=3.7.0.0718&qrcode=https%3A%2F%2Fqr.alipay.com%2Fbax05351pgjhc4yegd2y2084%3F_s%3Dwebother&_t=1474448799004#Intent;scheme=alipayqr;package=com.eg.android.AlipayGphone;end";
           //window.location.href=dd;
        };
        function jumpOne(){
          RHNativeJS.openAliSDK();
           //window.location.href='http://baidu.com';
        };i
        function jumpTwo(){
          RHNativeJS.openURlFormKepler('http://m.jd.com');
        //window.location.href='https://ai.m.taobao.com/search.html?pid=mm_13127418_5600488_25688336&q=某某&unid=D02vdaw8ZZ003tf379k2';
        };
        function fuqinming(){
          xxx.openJDHomeApp();
        }
        function test(str){
          alert("dddddd:"+str);
          <!--var builder = new BolbBuilder();-->
          <!--builder.append(str);-->
         var myBlob = new Blob(str, {'type': 'text\/xml'});
          alert("fuqinming");
        }
        //btnAction();
        function openKepler(){
            //打开开普勒
            xxx.openJDHome();
        }
        //APP方式打开开普勒
        function openJDHomeApp(){
           xxx.openJDHomeApp();
        }
        //HTML方式打开开普勒
        function openJDHomeWeb(){
            xxx.openJDHomeWeb();
        }
        //打开阿里百川
        function openAliDemo(){
          xxx.openBaichuan();
        };
        //APP打开阿里百川
        function openAliHomeApp(){
          RHNativeJS.openAliHomeApp();
        }
        //HTML方式打开阿里百川
        function openAliHomeWeb(){
           alert("hehehe");
           xxx.openAliHomeWeb();
        }
        //测试
        function test(){
        //获取 输入框的值
        alert(document.getElementById("data").value);
        }
    </script>
</head>
<body>
<p/>
<p/>
调用京东NATIVE方法模拟：<br/>
<button type="submit" onclick="openKepler()">调起京东[判断是否安装]</button>
<p/>
<button type="submit" onclick="openJDHomeApp()">调起京东[APP打开方式]</button>
<p/>
<button type="submit" onclick="openJDHomeWeb()">调起京东[HTML打开方式]</button>
<p/>
<p/>
<p/>
调用淘宝百川NATIVE方法模拟：<br/>
<button type="submit" onclick="openAliDemo()">调起阿里百川[是否安装]</button>
<p/>
<button type="submit" onclick="openAliHomeApp()"> 调起阿里百川[APP打开方式]</button>
<p/>
<button type="submit" onclick="openAliHomeWeb()"> 调起阿里百川[HTML打开方式]</button>
<p/>
<p/>
<p/>
测试打开淘宝触屏版中的更多button<br/>
<button type="submit" onclick="btnAction()">调起更多button呼气协议</button>
<p/>
<p/>
下面为模仿返利网_淘宝返利<p/>
<input id="data" type="text" name="lname" />
<p/>
<input type="submit" value="测试"  onclick="test()"/>
</body>
</html>