Создайте текстовый отчет с помощью JavaScript и HTML
Я написал код HTML\JavaScript. HTML-страница, получающая три сведения от конечного пользователя. На основе ввода пользователя я хочу, чтобы javascript генерировал номера штрих-кода и загружал отчет в виде текстового файла. Здесь переменная «B12» — это номер штрих-кода.
Код показан здесь:
const AL = document.getElementById("N1").value;
var to = Number(document.getElementById("N3").value);
var i = 1
var barcode = "1" + document.getElementById("N2").value;
while (i < to) {
const myArray = barcode.split("");
let B1 = myArray[1] * 8
let B2 = myArray[2] * 6
let B3 = myArray[3] * 4
let B4 = myArray[4] * 2
let B5 = myArray[5] * 3
let B6 = myArray[6] * 5
let B7 = myArray[7] * 9
let B8 = myArray[8] * 7
let B9 = B1 + B2 + B3 + B4 + B5 + B6 + B7 + B8
let B10 = B9 % 11
let B11 = 11 - B10
B11 = B11 === 10 ? '0' : B11;
B11 = B11 === 11 ? '5' : B11;
rem = barcode.substring(1);
let B12 = AL + rem + B11 + "IN"
i++;
barcode++;
}<form id = "my-form">
<label for = "T1">BARCODE FIRST TWO CHARATER</label><br><br>
<input type = "" text " maxlength = "2 " onkeyup = "this.value=t his.value.toUpperCase(); " id = "N1 " onchange = "validity.valid||(value='' ) " required> <br><br>
<label for = "T2 ">Barode Starting Eight Numbers:</label><br><br>
<input type = "text " pattern = "[0-9]{8} " maxlength = "8 " onchange = "validity.valid||(value='' ) " id = "N2 " required ><br><br>
<label for = "T3 ">Number of Barcode (Max 1000):</label><br><br>
<input type = "number " id = "N3 " min = "1 " max = "1000 " onchange = "validity.valid||(value='' ) " required ><br><br>
<center><button type = "submit " name = "myButton ">Submit</button></center>
</form>Я хочу, чтобы этот цикл javascript генерировал отчет со значением переменной «B12» и загружал его в виде текстового файла, пока пользователь нажимал кнопку отправки. Пожалуйста помогите в деле.
Я читал, но это не объясняет, что мне нужно.
Мне все кажется неправильным в вашем коде, вы смешиваете числовые значения со строками, ваши переменные имеют абстрактные имена и т. д. Я хотел бы вам помочь, но я ничего не понимаю в вашей логике генерации, даже после некоторых исследований в Интернете. Штрих-коды...
@MisterJojo Здесь мой требуемый штрих-код содержит 13 буквенно-цифровых цифр (2 + 9 + 2). Пример: RG777777784IN RG777777798IN. Здесь первые два алфавита — это тип статьи, а последние два алфавита — это код страны. Теперь числовое значение, имеющее от третьего до одиннадцатого числа. Это числовое значение, имеющее девять разрядов. Из девяти цифр первые восемь цифр, имеющих порядковый номер, и последняя цифра будут сгенерированы при вычислении, показанном здесь
@MisterJojo Также, если девятое числовое значение равно 10, его следует изменить на 0, а если девятое числовое значение равно 11, его следует изменить на 5. Например: RG777777775IN и RG000044770IN
@MisterJojo Теперь я хочу, чтобы пользователь ввел первый алфавит, восьмизначный штрих-код и необходимое количество штрих-кода. На основе этого значения загрузите текстовый файл со всеми этими номерами штрих-кода.
Может ли 12 или 00000012 быть действительным Barode Starting Eight Numbers:?
@MisterJojo Да, 00000012 также является действительным штрих-кодом. Поэтому я добавил 1 перед номером var barcode = "1" + document.getElementById("N2").value; И затем удалил его по коду ниже rem = barcode.substring(1);
Ответы 1
Может быть, вы можете попробовать это ...
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta http-equiv = "X-UA-Compatible" content = "IE=edge">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<title>Barcode Number Generaot</title>
<style>
body {
font-family : Arial, Helvetica, sans-serif;
font-size : 18px;
}
legend { font-weight: bold; padding: 0 .8em; }
fieldset { margin: 1em; width: 15em; }
label, input, button, pre { display: block; float: left; clear: both; margin-top: 0.2em; }
label { margin-top: 0.7em; font-size: .9em;}
input { text-align: center; }
button { margin-top: 2em; width: 6em; }
fieldset button:last-of-type { clear: none; float: right; }
pre { font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: .8em;}
</style>
</head>
<body>
<form id = "my-form" action = "#">
<fieldset>
<legend>BarCode</legend>
<label>1st TWO characters</label>
<input name = "N1" type = "text" autocomplete = "off" pattern = "[A-Za-z0-9]{2}" required >
<label>1st Eight digits:</label>
<input name = "N2" type = "number" min = "1" max = "99999998" required >
<label>Number of Barcode (Max 1000):</label>
<input name = "N3" type = "number" min = "1" max = "10000" required value = "1">
<button type = "reset">clear</button>
<button type = "submit">generate</button>
</fieldset>
</form>
<label>Generated BarCodes:</label>
<pre id = "BC-genered"></pre>
<script>
const
CRcode = `\n` // carriage return
, writeToTextFile = (text, fileName) =>
{
let textFile = null;
const makeTextFile = (text) =>
{
const data = new Blob([text], { type: 'text/plain' });
if (textFile !== null)
{
window.URL.revokeObjectURL(textFile);
}
textFile = window.URL.createObjectURL(data);
return textFile;
};
let link = document.createElement('a');
link.setAttribute('download', fileName);
link.href = makeTextFile(text);
link.click();
}
, BCgen = document.querySelector('#BC-genered')
, myForm = document.querySelector('#my-form')
, digtsM = [8,6,4,2,3,5,9,7]
;
myForm.N1.oninput = () =>
{
myForm.N1.value = myForm.N1.value.toUpperCase();
if (myForm.N1.value.length > 2)
myForm.N1.value = myForm.N1.value[0] + myForm.N1.value[2];
}
myForm.N3.oninput = () =>
{
let N2_max = 99999999 - myForm.N3.valueAsNumber;
if ( myForm.N2.valueAsNumber > N2_max)
myForm.N2.valueAsNumber = N2_max;
myForm.N2.max = N2_max;
}
myForm.onreset = () =>
{
BCgen.textContent = '';
}
myForm.onsubmit = e =>
{
e.preventDefault() // disable submit (no page reloading in this case)
BCgen.textContent = '';
let B_1_8_CodeN = myForm.N2.valueAsNumber;
for (let i=myForm.N3.valueAsNumber; i--;)
{
let
Bcode = B_1_8_CodeN.toString(10).padStart(8, '0')
, B11 = 11 - ([...Bcode].map((x,i)=> x *digtsM[i]).reduce((sum,v)=>sum+v) % 11)
;
B11 = (B11 === 10) ? 0 : ( B11 === 11) ? 5 : B11;
BCgen.textContent += myForm.N1.value
+ Bcode
+ B11
+ 'IN'
+ CRcode;
B_1_8_CodeN++;
}
writeToTextFile(BCgen.textContent, `${myForm.N3.value}_Barcodes_${myForm.N1.value}_${myForm.N2.value}.txt`);
}
</script>
</body>
</html>
Этот вопрос отвечает на ваш?