从json结果中追加<option>可以通过以下步骤实现:
以下是一个示例代码片段(使用JavaScript和jQuery)来演示如何从JSON结果中追加<option>:
// 假设JSON结果为以下格式
var jsonResult = {
"options": [
{"value": "1", "text": "选项1"},
{"value": "2", "text": "选项2"},
{"value": "3", "text": "选项3"}
]
};
// 解析JSON结果
var options = jsonResult.options;
// 遍历数据并构建<option>元素
$.each(options, function(index, option) {
var value = option.value;
var text = option.text;
// 创建<option>元素
var optionElement = $("<option>").val(value).text(text);
// 追加<option>到<select>元素
$("select").append(optionElement);
});
在上述示例中,我们首先解析了JSON结果,然后遍历了每个选项,并创建了相应的<option>元素。最后,我们将这些<option>元素追加到了一个<select>元素中。
请注意,这只是一个示例,具体的实现方式可能因编程语言和框架而异。你可以根据自己的需求和技术栈进行相应的调整和实现。
layui中的input radio单选框监听选择触发事件:
根据给input绑定的 lay-filter 进行查找input,然后进入函数判断
//点击追加触发
$(function(){
$("#button").click(function(){
var div_ = $("#sel").val();
var context = $("#context").val();
append(div_,context);
//$("#tab tr:not(:first)").remove();
//$("#tab tbody").empty();
$("#tab tbody").remove();
query();
});
});
//点击查询全部触发
$(function(){
$("#but").click(function(){
$("#tab tbody").remove();
//$("#tab tr:not(:first)").remove();
//$("#tab tbody").empty();
query();
});
});
//点击模糊查询触发
$(function(){
$("#query").click(function(){
var context = $("#context").val();
alert("您输入的内容为:"+context);
$("#tab tr:not(:first)").empty();
//$("table tbody").remove();
queryByContext();
});
});
//删除事件
function del(id){
var url = "testController/delModel";
$.ajax({
type: 'POST',
url: url,
data:{id: id},
dataType: 'json',
success: function(data){
alert("数据库删除成功");
$("#tab tr:not(:first)").empty();
query();
}});
};
//编辑事件
function upd(id){
var url = "";
$.ajax({
type: 'POST',
url: url,
data:{id: id},
dataType: 'json',
success: function(data){
alert("数据库编辑成功");
$("#tab tr:not(:first)").empty();
query();
}});
}
//添加方法
function append(div_,context){
$("#"+div_).append("jquery实现表格动态添加
");
$.get("testController/addModel",{div_id: div_, context: context }).done(function( data ) {
alert("添加到数据库成功");
});
};
//模糊查询方法
function queryByContext(){
var url = "testController/queryAllDataByContext";
$.ajax({
type: 'POST',
url: url,
data:{context:$("#context").val()},
dataType: 'json',
success: function(data){
alert("数据库查询成功");
console.log(data);
for(var i=0;i<data.length;i++){
var id = data[i].id;
var divId = data[i].divId;
var context = data[i].context;
var dtt = data[i].dtt;
//alert(id);
$("#tab thead").append(""+ div_ +" "+""+context+" ");
}
},
error:function(){
alert("数据库查询失败");
}
});
};
//查询全部方法
function query(){
var url = "testController/queryAllData";
$.ajax({
type: 'POST',
url: url,
dataType: 'json',
success: function(data){
alert("查询成功");
con"+id+" "+""+divId+" "+""+context+" "+""+dtt+" "+"删除
领取专属 10元无门槛券
手把手带您无忧上云