Javascript 在ajax调用之后添加文本区域是成功的
我有一张表格,上面有下拉列表。选择下拉列表后,文本必须与相关下拉列表值一起显示。我正在使用flask、jquery、jinja和html。我正在添加我在这里尝试过的内容Javascript 在ajax调用之后添加文本区域是成功的,javascript,jquery,html,Javascript,Jquery,Html,我有一张表格,上面有下拉列表。选择下拉列表后,文本必须与相关下拉列表值一起显示。我正在使用flask、jquery、jinja和html。我正在添加我在这里尝试过的内容 <div class="col-md-4"> <select name="select1" class="form-control" id="select1" style="width:200px; height:30px;" required> <option value=
<div class="col-md-4">
<select name="select1" class="form-control" id="select1" style="width:200px; height:30px;" required>
<option value="">Select the below option</option>
{% for each_round in round_names %}
<option value="{{each_round.round_id,each_round.round_name}}">{{each_round.round_name}}</option>
{% endfor %}
</select>
<div class="valid-feedback">Valid</div>
<div class="invalid-feedback">Please fill out this field</div>
<div id="resultDiv">
{{results}}
<textarea name="rdesc" id="rdesc" style="width:200px; height:300px;" required>{{results}}</textarea>
</div>
</div>
$("select[name='select1']").change(function() {
var dropdownValue = document.getElementById("select1");
var roundName = dropdownValue.options[dropdownValue.selectedIndex].value;
console.log(roundName);
$.ajax({
type: 'POST',
url: '/roundname/get-description',
data: {
'round_name': roundName
},
success: function(results) {
console.log(results);
$("textarea[id='resultDiv']").html(results);
}
})
})
正在发生的是:
1.当我降落在表单上时,将显示空文本区域
2.选择下拉值后,相关值不会显示
我需要的是:
1.除非选择下拉列表,否则不应显示文本区域
2.选择下拉列表后,文本区域应显示数据
我也试过这个
您的选择器不正确。您的文本区域没有id resultDiv。它有id rdesc,所以使用它,并以这种方式使用它,$rdesc.htmlresults 还请注意,如果结果是JSON对象,则需要访问要在textarea中显示的JSON的属性。大概是这样的: var结果={a:10}; $rdesc.htmlresults.a;
我建议,为了隐藏textarea,您应该使用css中的display:none属性,如果您希望文本区域不显示,除非我选择下拉列表,而不仅仅是使用jquery$id.cssdisplay,block更改display属性;也可以使用jquery预定义方法 $'id'。隐藏; $'id'。显示;
关于您的另一个查询,即一旦我选择下拉列表,文本区域将显示数据。您应该使用$rdesc.valresults;而不是使用$textarea[id='resultDiv'].htmlresults 嗨,我改了,它不工作了。我没有在文本中看到结果值area@GuruKrishna,请您记录您的ajax响应并将其添加到您的question@GuruKrishna请添加Ajax的响应,但我需要文本区域在我选择下拉列表之前不应显示,有没有办法去do@GuruKrishna您可以首先将文本区域设置为display:none;然后在success函数中只需执行$rdesc.show文本区域在html中,如果您不希望它显示,则显示:none并在ajax调用成功返回时进行更改-console.logresults显示什么?