单击select'时将数组行回显到文本区域中;s选项
Echo array rows into textareas when clicking on select's option
我正在从数据库中检索一个充满数据的数组。我想建立一个包含所有名称的下拉列表,当单击一个名称时,我想将值回显到表单中的某个文本区域。像这样:
array
0 =>
array
'id'
'name'
'desc'
'date'
1 =>
array
'id'
'name'
'desc'
'date'
这将是我的代码:
<html>
<head>
</head>
<body>
<form method="post">
<select>
<?php some foreach that fills the dropdown ?>
</select>
<input type="text" id="nombre" name="name">
<input type="text" id="dato" name="date">
<textarea id="desc" name="desc"><?php echo ...></textarea>
<input class="cbp-mc-submit" type="submit" value="publish" />
</form>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
听起来你可以通过PHP填充下拉列表。以下是获取所选选项的值(或文本)并将其放入文本区域的方法:
$('#selID').change(function(){
$('#taID').val( this.value );
//or
//$('#taID').val( $(this).find(':selected').text() );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="selID">
<option value="">Choose One</option>
<option value="audi">Audi Automobile</option>
<option value="burger">Deluxe Hamburger</option>
<option value="bunnie">Peter Rabbit</option>
</select>
<br>
<textarea id="taID" rows="5" cols="20"></textarea>
注:
this
指的是触发javascript的元素——在本例中,<select>
控件的更改事件触发了js。
在纯javascript中,this.value
返回元素的值。但是,如果您需要运行更多的jQuery操作(如.find()
或.text()
),则需要返回一个jQuery对象供这些操作操作。在这种情况下,请使用$(this)
。
由于this.value
的键入速度比$(this).val()
快,所以当我不需要创建jQuery对象时,我使用了纯js方法。当我只需要获取元素的ID时,我经常使用相同的快捷方式,例如:
var myID = this.id;
您可以将输出传递给json_encode(),并使用下面的代码块接收它。
$("#selectID").on('change', function() {
var sid = $('select[name=select]').val();
$.ajax({
url: "/get/data",
data: {sid:sid},
type: "POST",
dataType : "json",
success: function(xhr){
$('#desc').val(xhr);
});
}
});
});
相关文章:
- onkeyup无法动态创建多个文本区域
- 具有所有样式的文本正在复制到可编辑文本区域
- 在文本区域POST后解码JSON
- 在文本区域中使用jQuery.text()保持换行符
- ng在下拉列表和文本区域提交
- 将文本插入光标所在的文本区域
- 离开页面导航后保留文本区域内容
- Javascript-在文本区域中断,但不在段落中中断
- 当选择值x时,Javascript需要在正确的位置显示文本区域,从而循环通过具有选择选项的表单
- 测试文本区域中的特定文本格式
- 文本编辑后,append函数不适用于文本区域
- 如何在ReactJs中链接下拉列表和文本区域
- I'我试图在文本区域中进行特定的输入,调用特定的javascript函数,但没有成功;不起作用
- 使用JSON文件中的变量(字符串)填充文本区域
- JavaScript-如果以前不存在文本,如何从文本区域删除新行
- 如何在php中创建一个函数,该函数与文本区域一起工作,通过输入类似[color:red]的内容来打印具有等效颜色的文本
- 如何为动态创建的文本区域中输入的值更新ng模型
- 延迟高亮显示文本区域中的文本
- 将字母添加到文本区域的末尾
- TinyMCE在新添加的文本区域