zoukankan      html  css  js  c++  java
  • 使用JS意识到自己主动提交表单

            今天将需要chat集成到客户的网站上去,注册用户链接登录这个网站后点击实现网站直接登录chat向上。我不停chat原来的登录界面,采纳JS当页面跳转技术,随着时间的推移自己主动填写表格。自己主动提交表单,从而实现站点用户无需再次登录就可以进入chat。详细代码实现例如以下

    JS代码

    <script> 
    //取得cookie值 
    function getCookie(name){
        var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)"); 
        if(arr=document.cookie.match(reg)){
            return unescape(arr[2]); 
        }else{
            return null; 
        } 
    } 
    
    //表单自己主动提交函数
    function tijiao(){ 
         function sub(){ 
             var a = document.getElementById('loginForm');
             a.elements[2].value = getCookie('username');
             a.elements[3].value = getCookie('username');
             var opts = document.getElementById("channelField");
             opts[1].selected = 'selected';
             opts[0].selected = '';
             a.submit();
        }
    setTimeout(sub,0);//以毫秒为单位的.1000代表一秒钟.依据你须要改动这个时间. 
    }
    
    //点击button提交表单
    function clickbutton(obj){ 
        obj.onclick = function(){ 
            obj.submit(); 
        } 
    }
    </script>

    HTML代码

    <form id="loginForm" name="loginForm" action="[LOGIN_URL/]" method="post" enctype="application/x-www-form-urlencoded">
        <div id="loginFormContainer" style="margin:0px;padding-bottom: 10px;">
            <input type="hidden" name="login" id="loginField" value="login"/>
            <input type="hidden" name="redirect" id="redirectField" value="[REDIRECT_URL/]"/>
            <div><label for="userNameField">[LANG]userName[/LANG]:</label>
            <input type="text" name="userName" id="userNameField" maxlength="[USER_NAME_MAX_LENGTH/]"/></div><br />
            <div><label for="passwordField">[LANG]password[/LANG]*:</label>
            <input type="password" name="password" id="passwordField"/><span style="margin-left:4px; color: #339900;">默认是您的username</span></div><br />
            <div><label for="channelField">[LANG]channel[/LANG]:</label>
            <select name="channelName" id="channelField">[CHANNEL_OPTIONS/]</select></div><br />
            <div><label for="languageSelection">[LANG]language[/LANG]:</label>
            <select id="languageSelection" name="lang" onchange="ajaxChat.switchLanguage(this.value);">[LANGUAGE_OPTIONS/]</select></div><br />
            <!--
            <div><input type="submit" name="submit" style=" 240px;height: 50px;background: url(../chat/img/bglogin2.png);background-repeat: no-repeat;border: 0px;" id="loginButton" value=""/></div>
            -->
            <div><button name="subButton" onclick="clickbutton(this);" style=" 240px;height: 50px;background: url(../chat/img/bglogin2.png);background-repeat: no-repeat;border: 0px;" id="loginButton" value=""></button></div>
        </div>
    </form>

    PS:
    1. 要在body中增加onload="tijiao();"
    2. 另外表单的提交button(submit)须要隐去。不然会和js的submit()方法冲突,这里採用button提交,避免在自己主动登录失败时没这里提交button


    版权声明:本文博客原创文章。博客,未经同意,不得转载。

  • 相关阅读:
    solr6.5搭建以及使用经验
    Intellij IDEA svn的使用记录
    初次从eclipse转到intellij idea上的一些经验
    Linux一键安装PHP/JAVA环境OneinStack
    CentOS下yum安装mysql,jdk以及tomcat
    centos yum换阿里云源
    ehcache配置:使用Spring+SpringMVC+Mybatis或者有shiro
    微博短链接的生成算法(Java版本)
    手把手教你使用Git
    工作中有关分布式缓存的使用和需要注意的问题梳理
  • 原文地址:https://www.cnblogs.com/blfshiye/p/4736273.html
Copyright © 2011-2022 走看看