Question

在表单上创建一个名为“转到其他网站”的按钮，该按钮将调用一个函数来提供一个弹出窗口，以转到用户选择的网址和窗口大小。该功能将使用提示框为用户提供至少3种网址选择（与您的网站相关的其他网站）可供选择。

使用switch语句设置所选的URL并验证用户选择，在有有效选择之前不要继续。然后将提示用户以像素为单位输入窗口的高度和宽度。必须验证最小高度和宽度为500.在有效高度和宽度之前不要继续。使用此分辨率在窗口中显示所选的URL。（提示：要设置window.open方法的其他属性，您需要创建一个字符串变量来设置宽度和高度。）

这是我的HTML

 <!DOCTYPE html>
    <html>
    <head>
    <script src= "../javascript/a1.js"></script>
    <title>HTML5 Template</title>
    </head>

    <body>
    <h1>Sign Up form</h1>
    <form name="userForm" onsubmit= "return validateForm()" >

    First name: <input type="text" id="firstname" size="30" />
    <br><br>
    Last name: <input type="text" id="lastname" size="30" />
    <br><br>
    Postcode: <input type="text" id="postcode" size="30" />
    <br><br>
    Email: <input type="text" id="email" size="30" />
    <br><br>
    <h1>Payment details</h1>
    <br>
    Credit Card:<select name="Credit Card">
    <option value="Visa">Visa</option>
    <option value="Mastercard">Mastercard</option>
    <option value="American Express">American Express</option>
    </select>
    <br><br>
    Card Number: <input type="text" id="cardnumber" size="30" />
    <br><br>
    CCV: <input type="text" id="ccv" size="30" />
    <br><br>
    Expiry MM/YY:<SELECT id="exMonth" title="select a month" >
    <OPTION VALUE="0" SELECTED>--Month--
    <OPTION VALUE="01">01
    <OPTION VALUE="02">02
    <OPTION VALUE="03">03
    <OPTION VALUE="04">04
    <OPTION VALUE="05">05
    <OPTION VALUE="06">06
    <OPTION VALUE="07">07
    <OPTION VALUE="08">08
    <OPTION VALUE="09">09
    <OPTION VALUE="10">10
    <OPTION VALUE="11">11
    <OPTION VALUE="12">12
    </SELECT> /
    <SELECT id="exYear" title="select a year">
    <OPTION VALUE="0" SELECTED>--Year--
    <OPTION VALUE="2016">2016
    <OPTION VALUE="2017">2017
    <OPTION VALUE="2018">2018
    <OPTION VALUE="2019">2019
    <OPTION VALUE="2020">2020
    <OPTION VALUE="2021">2021
    <OPTION VALUE="2022">2022
    <OPTION VALUE="2023">2023
    <OPTION VALUE="2024">2024
    <OPTION VALUE="2025">2025
    <OPTION VALUE="2026">2026
    <OPTION VALUE="2027">2027
    </SELECT>




    <br><br>
    <input type="submit" value="Submit Form" />
    <input type="button" onClick="Help()" value="Help">

    </form>
    </body>
    </html>

这是我的java脚本代码

function validateForm()
{
var firstname=document.getElementById("firstname");
var lastname=document.getElementById("lastname");
var postcode=document.getElementById("postcode");
var email=document.getElementById("email");
var cardnumber=document.getElementById("cardnumber");
var ccv=document.getElementById("ccv");


//var message= ""
// message += \n   makes all the message display in one box  //

    if (firstname.value=="")
    {
        alert("Please enter your first name");
        firstname.focus();
        return false;
    }
    if (lastname.value==""){
        alert("Please enter your last name");
        lastname.focus();
        return false;
    }
    if (postcode.value.length!=4 || isNaN(postcode.value)){
        alert("Please enter 4 numbers for your postcode");
        postcode.focus();
        return false;
    }

    if (email.value.indexOf("@")== -1 ) {
        alert("Please include @ symbol");
        email.focus();
        return false;
    }

    if (email.value.indexOf(".")== -1 ) {
        alert("Please include . symbol");
        email.focus();
        return false;
    }
    if (cardnumber.value.length!=16 || isNaN(cardnumber.value)){
        alert("Please enter yout 16 digit credit card number");
        cardnumber.focus();
        return false;
    }   
    if (ccv.value.length!=3 || isNaN(cardnumber.value)){
        alert("Please enter yout 3 digit ccv");
        ccv.focus();
        return false;






    }
    alert("Thank you for your submission");
    return true;
}

function Help() {
var Window1 = window.open("", "", "width=350, height=100");
Window1.document.write("<p>Required fields cannot be left blank<br>The email address must contain an @ and a dot<br>The credit card month and year must be valid<br>The postcode must contain four numbers<br>Enter the ccv<p>")
return;
}

带有switch语句的javascript弹出窗口

0 个答案: