Question: I need the script.js. Thanks! When you make an online purchase using a credit card, many sites require you to identify which type of card



I need the script.js. Thanks!
When you make an online purchase using a credit card, many sites require you to identify which type of card you're using Visa, MasterCard, etc.) before entering the card number. However, numbers for each card company follow different rules, and the type of card can be deduced from the card number itself. In this project, you'll enhance a section of an order form using regular expressions. After a credit card number is entered, you'll use a series of iflelse statements to check the number against regular expressions for four major card companies, and then to select the option button for the matching card type automatically. Major credit card numbers must be in the following formats: > American ExpressNumbers start with 34 or 37 and consist of 15 digits. > DiscoverNumbers begin with 6011 or 65 and consist of 16 digits. > MasterCardNumbers start with the numbers 51 through 55 and consist of 16 digits. > VisaNumbers start with a 4; new cards consist of 16 digits and old cards consist of 13 digits. Note | More information on credit card numbers and regular expressions is available at http://www.regular-expressions.info/creditcard.html. 1. In your text editor, open the index.htm file from the HandsOnProject8-3 folder in the Chaptero8 folder, add your name and today's date where indicated in the comment section, and then save the file. 2. Before the closing tag, add the following script element, save your changes, and then close index.htm 3. Create a new file in your text editor, create a JavaScript comment section containing the text Hands-on Project 8-3, your name, today's date, and the filename script.js, and then save the file with the name script.js to the HandsOnProjects-3 folder. 4. Add a statement instructing processors to interpret the document contents in strict mode. 5. Declare a new function named selectCardType(). Declare the local variables listed in Table 8-9 with the values shown: VARIABLE NAME cardumValue VALUE document.getElementById("ceNum").value /*4[0-9] (12) (?:[0-9]{3))/ /^5[1-5] [0-9](24191 /*6(?:01115[0-9]{2))[0-9] (12) /*3[47][0-9]{12}$/ discover amex Table 8-9: Variable names and values 2 6. Within the selectCardType() function, add the following series of if/else statements to test the card number entered by a user against the regular expressions and check the option button for the matching card type: 1 if (visa.test(cardNumValue)) { document.getElementById("visa").checked = "checked"; } else if (mc.test(cardNumValue)) { document.getElementById("mc").checked = "checked"; } else if (discover.test(cardNumvalue)) { document.getElementById("discover").checked "checked"; } else if (amex.test(cardNumvalue)) { document.getElementById("amex").checked "checked"; 3 4 5 6 7 8 1 2 7. Below the selectCardType() function, add the following code to create an event listener: function createEventListeners() { var cardNum = document.getElementById("CcNum"); if (cardNum.addEventListener){ cardNum.addEventListener("change", selectCardType, false); } else if (cardNum.attachEvent) { cardNum.attachEvent("onchange", selectCardType); 3 5 6 7 } 8 } 9 10 11 if (window.addEventListener) { window.addEventListener("load", createEventListeners, false); } else if (window.attachEvent) { window.attachEvent("onload", createEventListeners); } 12 13 8. Save your changes to script.js, and then open index.htm in a browser. 9. Click in the Card #box, type 378282246310005, and then press Tab. As Figure 8-18 shows, the American Express option is selected because this card number matches the regular expression for American Express cards. Hands-on Project 8-3 Payment Information Card + 378282245318005 Visa Master Cardo Discover American Express Figure 8-18: Completed form with correctly identified card number 10. Create a document in a text editor, and then repeat Step 9 to test the following card numbers, recording the credit card type for each number in your document. Each card number should be identified as a different card type. a. 4012888888881881 b. 371449635398431 C. 5105105105105100 d. 6011000990139424
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
