如何格式化信用卡输入字段和失效日期 [英] How to format credit card input fields and expiry date
问题描述
我想将其格式设置为过期框中/两边的两个数字。
我只是在表单中放置/以显示我想要做的事情。
$ b < input class =inputCardtype =textname =creditCard1id =creditCard1/>
-
< input class =inputCardtype =textname =creditCard2id =creditCard2/>
-
< input class =inputCardtype =textname =creditCard3id =creditCard3/>
-
< input class =inputCardtype =textname =creditCard4id =creditCard4/>
< br />
信用卡到期:
< input class =inputCardtype =textname =expiryid =expiry/>
我想格式化它,因此它只接受每个信用卡文本框中的四个数字。 p>
我不需要代码来验证我的数据与JavaScript(我知道如何做到这一点)。
我会说要做这样的事情:
信用卡过期时间:
< option value ='>月份< / option>
< option value ='01'> January< / option>
< option value ='02'> February< / option>
< option value ='03'> March< / option>
< option value ='04'> April< / option>
< option value ='05'> May< / option>
< option value ='06'> June< / option>
< option value ='07'> July< / option>
< option value ='08'> August< / option>
< option value ='09'> September< / option>
< option value ='10'> October< / option>
< option value ='11'> 11月< / option>
< option value ='12'> December< / option>
< / select>
< select name ='expireYY'id ='expireYY'>
< option value ='>年份< / option>
< option value ='10'> 2010< / option>
< option value ='11'> 2011< / option>
< option value ='12'> 2012< / option>
< / select>
< input class =inputCardtype =hiddenname =expiryid =expirymaxlength =4/>
然后,只需添加一段Javascript或jQuery,以合并来自 expireMM
和 expireYY
,并将其设置为过期
的值。我宁愿在PHP中使用服务器端,但这取决于您的确切设置。无论哪种方式,这是处理到期日期的常用方法。
Is there a way to code this with html/css?
I want to format it so two digits either side of the "/" in the expiry box. I have just places the "/" in the form on my web page to show what I am trying to do.
Credit Card Number:
<input class="inputCard" type="text" name="creditCard1" id="creditCard1"/>
-
<input class="inputCard" type="text" name="creditCard2" id="creditCard2"/>
-
<input class="inputCard" type="text" name="creditCard3" id="creditCard3"/>
-
<input class="inputCard" type="text" name="creditCard4" id="creditCard4"/>
<br />
Card Expiry:
<input class="inputCard" type="text" name="expiry" id="expiry"/>
I want to format it so it will only accept four numbers in each credit card text box.
I don't need the code to validate my data with javascript (I know how to do this). I am struggling with the html design.
I'd say do something like this:
Card Expiration:
<select name='expireMM' id='expireMM'>
<option value=''>Month</option>
<option value='01'>January</option>
<option value='02'>February</option>
<option value='03'>March</option>
<option value='04'>April</option>
<option value='05'>May</option>
<option value='06'>June</option>
<option value='07'>July</option>
<option value='08'>August</option>
<option value='09'>September</option>
<option value='10'>October</option>
<option value='11'>November</option>
<option value='12'>December</option>
</select>
<select name='expireYY' id='expireYY'>
<option value=''>Year</option>
<option value='10'>2010</option>
<option value='11'>2011</option>
<option value='12'>2012</option>
</select>
<input class="inputCard" type="hidden" name="expiry" id="expiry" maxlength="4"/>
Then just add a piece of Javascript or jQuery to combine the values from expireMM
and expireYY
and set it as the value for expiry
. I'd prefer doing it all server-side in PHP, but that depends on your exact setup. Either way, this is a common way to handle expiration dates.
这篇关于如何格式化信用卡输入字段和失效日期的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!