Блог

Главная - Вопросы по программированию - Я создал форму в html, и мне нужно добавить серийный номер, который увеличивается при отправке формы, как показано в коде в столбце invoice

Я создал форму в html, и мне нужно добавить серийный номер, который увеличивается при отправке формы, как показано в коде в столбце invoice

#html #forms

#HTML #формы

Вопрос:

Я создал форму в html, и мне нужно добавить серийный номер, который увеличивается при отправке формы, как показано в коде в столбце invoice .

 <html>
  <head>
    <meta charset="utf-8">
    <title>Invoice</title>
    <link rel="stylesheet" href="style.css">
    <link rel="license" href="http://www.opensource.org/licenses/mit-license/">
    <script src="script.js"></script>
  </head>
  <body>
    <header>
    <h1>Invoice</h1>
    <address contenteditable>
      <p>Jonathan Neal</p>
      <p>101 E. Chapman Ave<br>Orange, CA 92866</p>
      <p>(800) 555-1234</p>
   </address>
   <span>
     <img alt="" src="logo.png">
     <input type="file" accept="image/*">
   </span>
 </header>
 <article>
   <h1>Recipient</h1>
   <address contenteditable>
     <p>Some Company<br>c/o Some Guy</p>
   </address>
   <table class="meta">
  ***<tr>enter code here
     <th><span contenteditable>Invoice #</span></th>
     <td><span contenteditable>101138</span></td>
     </tr>***
     <tr>
     <th><span contenteditable>Date</span></th>
     <td><span contenteditable>January 1, 2012</span></td>
     </tr>
     <tr>
     <th><span contenteditable>Amount Due</span></th>
     <td><span id="prefix" contenteditable>$</span>
     <span>600.00</span>
     </td>
     </tr>
    </table>

Комментарии:

1. Должен ли он увеличиваться для каждого пользователя? Или только для этого пользователя? Для этого может потребоваться сервер…

2. только для этого пользователя

3. не могли бы вы дать краткое описание о вводе jscript, потому что я начинающий и мало что знаю о jscript

4. Луан Нико спасибо за ответ, но не могли бы вы дать мне полный ответ с помощью js, помещенного в html

5. Я добавил пример

Ответ №1:

Затем вы можете использовать Javascript; сначала добавьте an id к элементу, чтобы вы могли получить к нему доступ:

  <tr>
   <th><span contenteditable>Invoice #</span></th>
   <td><span contenteditable id="invoce">101138</span></td>
 </tr>

Затем вы можете добавить следующий js в свой файл сценария:

 var invoice = 101138;
$('button').on('click', function () {
    invoice  ; // increments invoice
    $('#invoice').text(invoice); // updates text on screen
});

То есть, если вы используете jquery, и 'button' является селектором для вашей кнопки.

Однако это будет сброшено, когда пользователь покинет сайт. Если вы хотите, чтобы он был постоянным, вам нужно использовать что-то вроде файлов cookie или localstorage.

Чтобы сделать его постоянным, вы можете использовать множество способов, например, local storage api.

Вот полный пример.