Question

我只想询问是否可以使用javascript或jquery将html选择标记中的值/数据保存/导出到文本文件中？这是我的选择标签。＆lt; select id =＆＃34; mySelect＆＃34; style =＆＃34; width：581px;高度：300像素;＆＃34;行=＆＃34; 10＆＃34;多个=＃＆34;多个＆＃34;＆GT;＆LT; /选择＆GT; 然后我试图使用这个javascript代码，从互联网上获取它，但它确实没有工作。它创建了一个文本文件，但它没有获取select标签的值/数据。 function saveTextAsFile（） { var textToWrite = document.getElementById（＆＃39; mySelect＆＃39;）。value; var textFileAsBlob = new Blob（[textToWrite]，{type：＆＃39; text / plain＆＃39;}）; var fileNameToSaveAs =＆＃34; directive.txt＆＃34 ;; var downloadLink = document.createElement（＆＃34; a＆＃34;）; downloadLink.download = fileNameToSaveAs; downloadLink.innerHTML =＆＃34;下载文件＆＃34 ;; if（$（＆＃39;＃sel1＆＃39;）。val（）==＆＃39;＆＃39;） { 提醒（＆＃39;请先选择帐户名，时间表和任务。＆＃39;）; } 其他 { window.webkitURL！= null; downloadLink.href = window.webkitURL.createObjectURL（textFileAsBlob）; } downloadLink.click（）; } var button = document.getElementById（＆＃39; save＆＃39;）; button.addEventListener（＆＃39; click＆＃39;，saveTextAsFile）; button.addEventListener（＆＃39; click＆＃39;，doClear）;

Answer 1

选择元素有<option>个孩子。 MDN's example：

<!-- The second value will be selected initially -->
<select name="text"> <!--Supplement an id here instead of using 'text'-->
  <option value="value1">Value 1</option> 
  <option value="value2" selected>Value 2</option>
  <option value="value3">Value 3</option>
</select>

因此，您var myOptions = document.GetElementByName("text")然后将myOptions .push每个值（或任何您想要的）迭代到数组中。然后将该数组写入您的文本文件。

Answer 2

我看到你的html中没有标签。我认为和标签中必须有标签。我改进了你的代码如下：

<body>

<label for="mySelect">Form input without an associated label </label>
<select id="mySelect" style="width: 581px; height:300px;" rows="10" multiple="multiple">
    <option id="id1" value="value1">id1</option>
    <option id="id2" value="value2">id2</option>
    <option id="id3" value="value3">id3</option>
    <option id="id4" value="value4">id4</option>
    <option id="id5" value="value5">id5</option>
</select>
<button id="save">save</button>
<script>
    function saveTextAsFile() {
        var textToWrite = document.getElementById('mySelect').value;
        var textFileAsBlob = new Blob([textToWrite], {type: 'text/plain'});
        var fileNameToSaveAs = "directive.txt";

        var downloadLink = document.createElement("a");
        downloadLink.download = fileNameToSaveAs;
        downloadLink.innerHTML = "Download File";
        console.log("innerHTML -> " + downloadLink.innerHTML);
//        if ($('#sel1').val() == '') {
//            alert('Please select ACCOUNT NAME, SCHEDULE and TASK first.');
//        }
//        else {
            window.webkitURL != null;
            downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
//        }
        downloadLink.click();
    }

    var button = document.getElementById('save');
    button.addEventListener('click', saveTextAsFile);
</script>
</body>

Answer 3

如果您有以下HTML选择元素，

<select id="mySelect">
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
   <option value="opel">Opel</option>
   <option value="audi">Audi</option>
</select>

我测试了以下代码正在运行。基本上如上面Ron所建议的那样，您需要迭代选项并将它们添加到字符串中以将其打印在文本文件中。

function saveTextAsFile() {
    var textToWrite = "";
    $('#mySelect>option').each(function () {
        textToWrite += this.value + " ";
    });
    var textFileAsBlob = new Blob([textToWrite], {
        type: 'text/plain'
    });
    var fileNameToSaveAs = "directive.txt";

    var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    if ($('#sel1').val() == '') {
        alert('Please select ACCOUNT NAME, SCHEDULE and TASK first.');
    } else {
        window.webkitURL != null;
        downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
    }
    downloadLink.click();
}

var button = document.getElementById('save');
button.addEventListener('click', saveTextAsFile);

将<select>标记值保存到文本文件中

3 个答案: