jquery 实施信用卡表单

42fyovps  于 2023-04-29  发布在  jQuery
关注(0)|答案(1)|浏览(122)

我正在尝试实现以下信用卡表单。.. https://github.com/jessepollak/card,跟随在名为Usage (without jQuery)的部分之后。我使用一个文本文件来实现它,该文件包含以下代码。..

var card = new Card({
  form: '#myform',
  container: '#con',
  formSelectors: {
    numberInput: 'input#number'
  }
});
<div id="con">
  <form id="myform">
    <input type="text" name="number">
  </form>
</div>
<script src="https://raw.githubusercontent.com/jessepollak/card/master/dist/card.js">
</script>

不幸的是,结果只是文本项显示在网页上。没别的了运行代码段时,它显示new Card的错误

xxslljrj

xxslljrj1#

1.在代码中直接使用它会阻止加载脚本。<script src="https://raw.githubusercontent.com/jessepollak/card/master/dist/card.js"> </script>所以试着
替换为<script src="https://cdnjs.cloudflare.com/ajax/libs/card/2.5.4/card.min.js"></script>
1.你必须用formSelectorsnumberInput: 'input#number'传递相应的字段,这是错误的选择方式。
1.你仍然会在控制台中得到错误,所以需要传递剩下的元素。

试试下面的代码片段

var card = new Card({
    form: '#myform',
    container: '#con',
    formSelectors: {
        numberInput: 'input[name="number"]',
        expiryInput: 'input[name="expiry"]',
        cvcInput: 'input[name="cvc"]',
        nameInput: 'input[name="name"]'
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/card/2.5.4/card.min.js"></script>

<div id="con">
    <form id="myform">
        <input placeholder="Card Number" type="text" name="number">
        <input placeholder="Full Name" type="text" name="name">
        <input placeholder="CSV" type="text" name="cvc">
        <input placeholder="Expiry" type="text" name="expiry">
    </form>
</div>

相关问题