如何使输入文本显示在文本字段中？

Question

我希望这个输入的项目名称和地址显示在文本区域。

目前，文本框中可以显示输入的项目名称和复选框文本。

ps: 上个问题忘记加checkbox HTML代码了

非常感谢你的帮助。

这是我的代码：

    let existValue = "";
    $('input:checkbox').click(function(){
        var tb = "#"+$(this).attr('rel');
        let text_to_add = this.name + "\n";
    
        let inputVal = $('#pname').val()
        //when click a checkbox and show checked items in the text area
        if($(this).is(":checked")){
            $(tb).val($(tb).val() + text_to_add);
        }else{
            let remove = this.name +"\n";
            //when a box is unchecked it clears the previously populated text from checkbox
            $(tb).val($(tb).val().replace(remove,""));
        }
    
        //storing the value to existValue
    
        existValue = $(tb).val().replace(`${inputVal}\n`, "");
            
    });
    
    $('#pname').on('input',(e)=>{
        //here to adding the input value to the existValue
        $('#textbox1').val(`${e.target.value}\n${existValue}`)
    });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div class="name">
                <form>
                    <label for="projectname">Project name:</label>
                    <input type="text" id="pname" name="pname">
                    <br>
                    <div class="form-group">
                        <label>Project Address:</label>
                        <input type="text" class="form-control" id="search_input" placeholder="Type address..." />
                        <input type="hidden" id="loc_lat" />
                        <input type="hidden" id="loc_long" />
                    </div>
                    <div class="latlong-view">
                        <p><b>Latitude:</b> <span id="latitude_view"></span></p>
                        <p><b>Longitude:</b> <span id="longitude_view"></span></p>
                    </div>
                </div>
<div class="series1">
                <tr><input type="checkbox" rel="textbox1" name="Cabinets" class=test/>
                    Cabinets
                </tr>
                <input type="checkbox" rel="textbox1" name="Doors"/>
                Doors
                <input type="checkbox" rel="textbox1" name="Drawers">
                Drawers
                <input type="checkbox" rel="textbox1" name="Drawer Fronts">
                Drawer Fronts
                <input type="checkbox" rel="textbox1" name="Handles">
                Handles
</div>
                <br>
                <textarea id="textbox1" ></textarea>

Answer 1

应该这样做：

const inps=$('input[type=text]').on('input',()=>
  $('#textbox1').val(inps.get().map(i=>i.value).join("\n"))
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="name">
  <form>
    <label for="projectname">Project name:</label>
    <input type="text" id="pname" name="pname">
    <br>
    <div class="form-group">
      <label>Project Address:</label>
      <input type="text" class="form-control" id="search_input" placeholder="Type address..." />
      <input type="hidden" id="loc_lat" />
      <input type="hidden" id="loc_long" />
    </div>
    <div class="latlong-view">
      <p><b>Latitude:</b> <span id="latitude_view"></span></p>
      <p><b>Longitude:</b> <span id="longitude_view"></span></p>
    </div>
</div>
<textarea id="textbox1"></textarea>

由于您当前的 HTML 中没有复选框，我删除了这些元素的事件处理并专注于 text-inputs。在我的代码片段中，我 select 按类型编辑了输入字段 (=text)。在一个真实的例子中，你应该对它们应用一个通用的 class 并通过它应用 select 它们。

如何使输入文本显示在文本字段中？

how can i make the input text display in the textfield?

javascript

jquery