通过选择<选项>在<选择>

Searching for a piece of code to update a textarea by selecting an <option> inside a <select>

本文关键字：gt lt 选择 选项      更新时间：2023-09-26

这是我几天前写的代码。我对这个PHP场景还比较陌生，不太确定如何实现这一点。我希望用户可以选择他们的文件显示在文本区域内。为此，我创建了一个<select>，他们显然可以像前面所说的那样选择文件。有没有很酷的助手，可以给我一个提示，甚至整个答案和代码？

<div class="bg-3 row">
                  <div class="col-sm-4"></div>
                    <div class="build_output">
                    <div class="col-sm-4">
                      <form action="viewer.php" method="post">
                        <div class="bg-3-content">
                          <div class="bg-3-hline">
                            <h2>Inhalt von <?php echo $selected; ?></h2>
                          </div>
                          <div class="bg-3-text">
                            <p>Hier sehen sie den Inhalt der Datei <?php echo $selected; ?> aus dem Ordner <?php echo $ordner; ?>. <br> Sie können diesen Text bearbeiten und mit einem Klick auf "Speichern" die Ursprungsdatei mit dem neuen Text überschreiben.</p>
                          </div>
                        </div>

                        <select name="dateien">
                          <?php
                          $ordner = "files";
                          $alledateien = scandir($ordner);
                          foreach ($alledateien as $datei) {
                            $dateiinfo = pathinfo($ordner."/".$datei);
                              $size = ceil(filesize($ordner."/".$datei)/1024);
                               if ($datei != "." && $datei != ".."  && $datei != "_notes") {
                               $bildtypen = array("jpg", "jpeg", "gif", "png");
                               if(in_array($dateiinfo['extension'], $bildtypen))
                               { ?>
                              <?php
                               }else{
                                  ?>
                                <option><?php echo $dateiinfo['filename']; ?> (<?php echo $dateiinfo['extension']; ?> | <?php echo $size ; ?>kb)</option>
                                <?php } ?>
                                <?php
                                 };
                             };
                             ?>
                           </select>
                        <?php
                          $selected = $_POST['dateien'];
                        ?>
                        <textarea class="form-control" type="text" name="output" cols="60" rows="20">
                            <?php
                              $output = file_get_contents($dateiinfo['dirname']."/".$selected);
                              echo $output;
                              $latestContent = $_POST['output'];
                            ?>
                        </textarea>
                        <br>
                      <input class="output-save" type="submit" value="Speichern" />
                      <a href="#" class="output-abort">Abbrechen</a>
                      </form>
                      </div>
                    </div>
                   <div class="col-sm-4"></div>
              </div> <!--bg-3--->

通过使用jQuery，您可以对HTML进行各种操作。

jQuery

// If your select dropdown changes
$(document).on('change', '.selector', function () {
    // Get the selected option
    var option = $(this).val();
    // If the option is optionone
    if (option == 'optionone') {
        // Change a textarea value
        $('.textarea-selector').html('something');
    }
});

HTML

<select class="selector">
    <option value="optionone">Option one</option>
    <option value="optiontwo">Option two</option>
</select>
<textarea class="textarea-selector">this will change</textarea>

我知道这是一个非常简单的例子，但它将说明一个轻松解决问题的好方法。

$(document).on("change", ":file", function() {
  file = $(this).prop('files')[0];
  $("#inpFileName").val(file.name);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="input-group-btn">Browse&hellip;
<input style="display: none;" type="file"> </label> 
<input class="form-control" disabled id="inpFileName" type="text">

您可以使用change-事件来处理对文件输入字段的输入更改。

相关文章：