求大佬做一下以下代码,输入指定邀请码:123 点注册跳转到a.html,不用邀请码点击游客访问跳到b.html,不同意条款的勾不打无法游客访问跟注册,就算输入邀请码。 [XHTML] 纯文本查看 复制代码 H5 [url=]返回[/url] 用户注册 [url=]登录[/url] 邀请码 [url=]同意条款[/url] 游客, 大佬
您可以尝试使用以下 JavaScript 代码来实现输入指定邀请码后跳转到 a.html,否则点击“游客访问”按钮跳转到 b.html,且必须勾选同意条款才能进行注册或游客访问: [JavaScript] 纯文本查看 复制代码// 获取页面元素 var input = document.querySelector('.input'); var btn = document.querySelector('.yzm'); var checkbox = document.querySelector('input[type="checkbox"]'); var submitBtn = document.querySelector('.btndl input[type="submit"]'); // 点击“游客访问”按钮时跳转到 b.html btn.onclick = function() { window.location.href = 'b.html'; }; // 监听表单提交事件 submitBtn.onclick = function(event) { // 如果未勾选同意条款,则阻止提交 if(!checkbox.checked) { event.preventDefault(); alert('请先同意条款!'); } // 如果输入的邀请码为 123,则继续提交表单并跳转到 a.html,否则阻止提交 else if(input.value !== '123') { event.preventDefault(); alert('邀请码不正确!'); } // 否则,直接提交表单 else { submitBtn.disabled = true; // 防止多次提交 } }; 在上述代码中,我们首先通过 `document.querySelector()` 方法获取了页面中的相关元素,然后给“游客访问”按钮和注册表单提交按钮分别绑定了 `onclick` 事件处理函数。在表单提交时,我们判断是否勾选了同意条款和输入的邀请码是否正确,如果都正确则继续提交表单并禁用提交按钮防止多次提交。否则,我们使用 `event.preventDefault()` 方法取消默认的提交行为并弹出相应的提示信息。
[XHTML] 纯文本查看 复制代码 H5 [url=]返回[/url] 用户注册 [url=]登录[/url] 邀请码 同意条款 在 XHTML 中,需要在文档开头声明 XML 版本和编码方式,以及 DOCTYPE 的声明。此外,XHTML 要求所有标签必须有相应的闭合标签,并使用小写字母表示标签名和属性名。此外,所有属性值都必须使用引号括起来。在上述代码中,我们针对这些要求进行了相应的修改。 另外,针对表单提交事件的处理,我们使用了一个名为 `submitForm()` 的 JavaScript 函数来实现。在该函数中,我们首先获取了输入邀请码的文本框和同意条款的复选框的状态,然后根据这些状态进行相应的判断和操作。如果勾选了同意条款并输入了正确的邀请码,则跳转到 a.html;否则,弹出相应的提示信息。
gc588 发表于 2023-5-13 19:58 [mw_shl_code=xhtml,true] css 是这样的,现在用上你改好的代码不对齐了 @charset "utf-8"; /* CSS Document */ * { margin: 0px; padding: 0px; } body { font-family: "Microsoft Yahei", "Calibri"; font-size: 14px; background-color: #FFF; color:#777; } a { /*-webkit-transition: all 0.3s ease-in; -moz-transition: all 1s ease-in; -o-transition: all 1s ease-in;*/ } a { cursor: pointer; text-decoration: none; color: #777; } a:hover { color: #09C; } li { list-style: none } img { border: 0; } textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="button"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus { border-color: rgba(82,168,236,0.8); outline: 0; } /*头部*/ .head { width: 100%; height: 50px; background: rgba(100,207,250,1); /*background:#093;*/ text-align: center; color: #fff; line-height: 50px; position: fixed; top: 0; } .head_lf { width:20%; float:left; } .head_lf img { vertical-align:middle; } .head_ct { width:65%; float:left; } .head a { color:#fff; } .head_rg { width:15%; float:right; } /*登录*/ .login { width:100%; margin-top:100px; } .text { padding:0px 40px; border-bottom:1px solid #ddd; } .login .name { background:url(../images/name.png) no-repeat; background-position:9px } .login .pwd { background:url(../images/pwd.png) no-repeat; background-position:9px } .login .text input { width:100%; height:42px; line-height:42px; font-family:"Microsoft Yahei", "Calibri"; border:0; color:#434343; } .tip { width:100%; margin-top:15px; overflow:hidden; } .tip a { float:right; padding:0px 15px; color:#09C; } .tip a input { margin-right:5px; vertical-align: -1.5px; } .btndl { width:100%; text-align:center; margin-top:40px; } .btndl input { width:88%; height:42px; color:#fff; border:0; font-family:"Microsoft Yahei", "Calibri"; cursor:pointer; font-size:16px; background:rgba(51,153,255,1); border-radius:5px; } /*注册*/ .zhuce { width:100%; margin-top:100px; } .zhuce .text { line-height:42px; padding:3px 10px; border-bottom:1px solid #ddd; display:block; overflow:hidden; } .zhuce .text span { width:20%; float:left; text-align:center; } .zhuce .text .input { width:80%; height:42px; font-family:"Microsoft Yahei", "Calibri"; border:0; float:left; text-indent:20px; } .zhuce .text .yzm { width:25%; text-align:left; } .zhuce .text .yzm input { border:0; padding:3px; font-family:"Microsoft Yahei", "Calibri"; background-color:rgba(255,153,0,1); color:#fff; cursor:pointer; font-size:12px; } /*底部*/ .foot { width: 100%; height: 50px; background: rgba(218,218,218,1); /*background:#D0D0D0;*/ text-align: center; color: #666; position: fixed; bottom: 0; } .foot a { width: 20%; text-align: center; float: left; display: block; } .foot a:hover{ color:#F30 } .now { color: #F30; } .foot span{ width:100%; display:block; } .foot span img{ width:20px; padding-top:5px; }