Question

所以我一直在尝试创建一个if语句，即使用户没有在函数“ submitOrder”中输入任何内容，该语句也会阻止“ submitOrder button”创建.txt文件。

我每次都单击按钮，即使有文本说“请输入名称”，也就像提到的那样，即使用户没有输入，它也会创建一个.txt文件。

编辑：为澄清起见，该文本文件已创建并保存到我存储hta文件的文件夹中。

function submitOrder(file) {

  var fso = new ActiveXObject("scripting.filesystemobject")
  var newfile = fso.createTextFile(file, true);
  var string = "Thank You For Your Order \r\n";
  var orderlist = document.getElementById("orderlist");
  var regx = /^[A-Za-z]+$/;
  var orderfilename = document.getElementById('orderfilename').value;

  for (i = 0; i < orderlist.length; i++) {
    if (orderlist.options[i].text != "list of ordered items") {
      string = string + orderlist.options[i].text + '\r\n';
    }
  }

  if (orderfilename == "") {
    alert("please enter a name for your order")
    return false;
  }

  if (!regx.test("orderfilename")) {
    alert("must contain text only")
    return false;
  } else {
    alert(string)
    return true;
  }

  newfile.WriteLine(string);
  newfile.Close();
}

<body onload="screen();">

  <h1>Gigantuano Pizza Company</h1>

  <p>Place your order now!</p>

  <select id="pizza">
    <option value="0.00">Select a pizza</option>
    <option value="10.00">Hawaiian - Large Stuffed Crust - $10.00</option>
    <option value="8.00">Hawaiian - XL Standard Base - $8.00</option>
    <option value="13.50">Hawaiian - XL Stuffed Crust - $13.50</option>
    <option value="10.00">Beef and Onion - Large Stuffed Crust - $10.00</option>
    <option value="8.00">Beef and Onion - XL Standard Base - $8.00</option>
    <option value="13.50">Beef and Onion - XL Stuffed Crust - $13.50</option>
    <option value="11.00">Peperoni Lovers - Large Stuffed Crust - $11.00
    </option>
    <option value="13.50">Chicken Supreme - Large Stuffed Crust - $13.50
    </option>
  </select>

  <input type="button" onclick="addOrderItem()" value="Add Order Item"><br>
  <br> Ordered Items: click to check order
  <select id="orderlist">
    <option value="0.00">list of ordered items</option>
  </select>
  <input type="button" onclick="removeOrderItem();" value="Remove Order 
    Item">

  <br> Order Total: <input type="text" id="ordertotal" value=0.0></input><br>
  <br>
  <br> Type your order submission file name (one word):<input type="text" id="orderfilename" value=""></input>
  Click to submit your order:
  <input type="button" onclick="submitOrder(document.getElementById('orderfilename').value + 
    '.txt');" value="Submit Order">
  <input type="button" value="Open Order Text File" onclick="OpenFile( 
    document.getElementById('orderfilename').value + '.txt' );" />
  <br>

</body>

Answer 1

脚本中的几个错误，引起了一些评论-对ActiveX的检查不太理想（不是问题的一部分）。

将事件处理程序移出标记；

请注意，我比问题做更多的工作，但是最重要的是，只有当您有有效订单时，才应该执行文本文件。

window.onload = screen();
// borrowed from https://stackoverflow.com/a/34729943/125981
function addEventListener(obj, evt, func) {
  if ('addEventListener' in window) {
    obj.addEventListener(evt, func, false);
  } else if ('attachEvent' in window) { //IE
    obj.attachEvent('on' + evt, func);
  }
}

function screen() {
  var bugs = "onscreen";
}
var sobuttonElement = document.getElementById('submitorder');
sobuttonElement.addEventListener('click', submitOrder);
var ofbuttonElement = document.getElementById('openfile');
ofbuttonElement.addEventListener('click', OpenFile);
var aoibuttonElement = document.getElementById('addorderitem');
aoibuttonElement.addEventListener('click', addOrderItem);
var roibuttonElement = document.getElementById('removeorderitem');
roibuttonElement.addEventListener('click', removeOrderItem);
var newLine = '\r\n';

function addOrderItem(event) {
  event.target.style.border = "solid 2px orange";
  //alert('Element clicked through function!');
  var select = document.getElementById('pizza');
  var pizzas = select.selectedOptions;
  //console.log(pizzas);
  var orderList = document.getElementById('orderlist');
  for (var i = 0; i < pizzas.length; i++) {
    // console.log(pizzas[i]);
    var opt = document.createElement('option');
    opt.value = pizzas[i].value;
    opt.innerHTML = pizzas[i].innerHTML;
    orderList.appendChild(opt);
    var orderTotal = document.getElementById('ordertotal');
    orderTotal.value = (orderTotal.value * 1) + (pizzas[i].value * 1);
  }
}

function OpenFile(event) {
  var orderfilenameValue = document.getElementById('orderfilename').value;
  var file = document.getElementById('orderfilename').value + '.txt'
}

function removeOrderItem() {
  var orderList = document.getElementById('orderlist');
  if (orderList.selectedIndex > 0) {
    orderList.options[orderList.selectedIndex].remove(orderList.selectedIndex);
    var orderTotal = document.getElementById('ordertotal');
    orderTotal.value = (orderTotal.value * 1) - orderList.options[orderList.selectedIndex].value;
  }

}

function getOrderText(message) {
  console.log(message);
  var orderText = "";
  var orderList = document.getElementById('orderlist');
  if (orderList.options.length > 1) {
    for (var i = 1; i < orderList.options.length; i++) {
      //console.log("food:", i, orderList.options[i]);
      orderText = orderText + newLine + orderList.options[i].text;
    }
    orderText = orderText + "\n\r" + message;
  }
  return orderText;
}

function submitOrder() {
  var orderfilenameValue = document.getElementById('orderfilename').value;
  var file = orderfilenameValue + '.txt';
  alert(orderfilenameValue);
  var thankYouMessage = "Thank You For Your Order \r\n";
  var orderlist = document.getElementById("orderlist");
  var regx = /^[A-Za-z]+$/;
  /* moved to a function
    for (var i = 0; i < orderlist.length; i++) {
      if (orderlist.options[i].text != "list of ordered items") {
        thankYouMessage = thankYouMessage + orderlist.options[i].text + '\r\n';
      }
    }
  */
  var isValidText = (orderfilenameValue.length > 0);
  if (!isValidText) {
    alert("please enter a name for your order");
    return false;
  }
  isValidText = isValidText && regx.test(orderfilenameValue);
  if (!isValidText) {
    alert("must contain text only");
    return false;
  } else {
    // only if we have a valid name
    var newfile = undefined;
    if ("ActiveXObject" in window) {
      let fso = new ActiveXObject("scripting.filesystemobject");
      newfile = fso.createTextFile(file, true);
    } else {
      alert("Must use Internet Explorer");
    }
    var orderTotal = document.getElementById('ordertotal');

    var message = "Order Total: " + orderTotal.value + newLine + thankYouMessage;
    var orderText = getOrderText(message);
    console.log(orderText);
    // in original code these were never executed
    if (newfile) {
      newfile.WriteLine(orderText);
      newfile.Close();
    }
  }
}

.row {
  margin-top: 1em;
  margin-bottom: 1em;
}

<body>
  <h1>Gigantuano Pizza Company</h1>
  <p>Place your order now!</p>
  <p>
    <select id="pizza">
      <option value="0.00">Select a pizza</option>
      <option value="10.00">Hawaiian - Large Stuffed Crust - $10.00</option>
      <option value="8.00">Hawaiian - XL Standard Base - $8.00</option>
      <option value="13.50">Hawaiian - XL Stuffed Crust - $13.50</option>
      <option value="10.00">Beef and Onion - Large Stuffed Crust - $10.00</option>
      <option value="8.00">Beef and Onion - XL Standard Base - $8.00</option>
      <option value="13.50">Beef and Onion - XL Stuffed Crust - $13.50</option>
      <option value="11.00">Peperoni Lovers - Large Stuffed Crust - $11.00
      </option>
      <option value="13.50">Chicken Supreme - Large Stuffed Crust - $13.50
      </option>
    </select>
    <button id="addorderitem" type="button">Add Order Item</button></p>
  <br><label for="orderlist">Ordered Items: click to check order</label>
  <select id="orderlist">
    <option value="0.00" selected>list of ordered items</option>
  </select>
  <button type="button" id="removeorderitem" onclick="removeOrderItem();">Remove Order 
    Item</button>

  <div class="row"><label for="ordertotal">Order Total:</label> <input type="text" id="ordertotal" value=0.0></input>
  </div>

  <div class="row"><label for="orderfilename">Type your order submission file name (one word):</label><input type="text" id="orderfilename" value="" />
  </div>
  <div class="row">
    <label for="submitorder"> Click to submit your order:</label>
    <button id="submitorder" type="button">Submit Order</button>
    <button id="openfile" type="button">Open Order Text File</button>
  </div>
</body>

Answer 2

在客户端，我们无法创建文件并将其保存到客户端。

Answer 3

以下条件不正确。

if (orderfilename == "") {将返回true

在下面一行中将orderfilename的值手动设置为""

<input type="text" id="orderfilename" value="">

所以只需更改以下条件即可按预期工作。

if (orderfilename && orderfilename.trim()) {

或
if(orderfilename.length>0)

function submitOrder(file) {

  var fso = new ActiveXObject("scripting.filesystemobject")
  var newfile = fso.createTextFile(file, true);
  var string = "Thank You For Your Order \r\n";
  var orderlist = document.getElementById("orderlist");
  var regx = /^[A-Za-z]+$/;
  var orderfilename = document.getElementById('orderfilename').value;

  for (i = 0; i < orderlist.length; i++) {
    if (orderlist.options[i].text != "list of ordered items") {
      string = string + orderlist.options[i].text + '\r\n';
    }
  }

  if (!(orderfilename && orderfilename.trim())) {
    alert("please enter a name for your order")
    return false;
  }

  if (!regx.test("orderfilename")) {
    alert("must contain text only")
    return false;
  } else {
    alert(string)
    return true;
  }

  newfile.WriteLine(string);
  newfile.Close();
}

<body onload="screen();">

  <h1>Gigantuano Pizza Company</h1>

  <p>Place your order now!</p>

  <select id="pizza">
    <option value="0.00">Select a pizza</option>
    <option value="10.00">Hawaiian - Large Stuffed Crust - $10.00</option>
    <option value="8.00">Hawaiian - XL Standard Base - $8.00</option>
    <option value="13.50">Hawaiian - XL Stuffed Crust - $13.50</option>
    <option value="10.00">Beef and Onion - Large Stuffed Crust - $10.00</option>
    <option value="8.00">Beef and Onion - XL Standard Base - $8.00</option>
    <option value="13.50">Beef and Onion - XL Stuffed Crust - $13.50</option>
    <option value="11.00">Peperoni Lovers - Large Stuffed Crust - $11.00
    </option>
    <option value="13.50">Chicken Supreme - Large Stuffed Crust - $13.50
    </option>
  </select>

  <input type="button" onclick="addOrderItem()" value="Add Order Item"><br>
  <br> Ordered Items: click to check order
  <select id="orderlist">
    <option value="0.00">list of ordered items</option>
  </select>
  <input type="button" onclick="removeOrderItem();" value="Remove Order 
    Item">

  <br> Order Total: <input type="text" id="ordertotal" value=0.0></input><br>
  <br>
  <br> Type your order submission file name (one word):<input type="text" id="orderfilename" value=""></input>
  Click to submit your order:
  <input type="button" onclick="submitOrder(document.getElementById('orderfilename').value + 
    '.txt');" value="Submit Order">
  <input type="button" value="Open Order Text File" onclick="OpenFile( 
    document.getElementById('orderfilename').value + '.txt' );" />
  <br>

</body>

Answer 4

我不确定您是否创建了文本文件，但是我确定下面的代码将在客户端创建文本文件。

  var hiddenElement = document.createElement('a');
  hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI("All your text should be here ");
  hiddenElement.target = '_blank';
  hiddenElement.download = 'Please give the file name such as test.txt';
  hiddenElement.style.display = 'none';
  document.body.appendChild(hiddenElement);
  hiddenElement.click();
  document.body.removeChild(hiddenElement);

即使没有输入，也不允许脚本创建.txt文件

4 个答案: