JS(还需要jquery1.5以上版本):
/** jQuery inputEvaluation Plugin
* 自动给input(除file)赋值.
* 好处：不用显式的页面上的input赋值，可以直接从后台传递过来json串
* 缺点：会导致form的reset的reset方法失去意义.
* jquery 版本不能低于1.5
* Copyright(c) 2022 bysag
* Version: 1.0
*/
(function($){
$.fn.inputEvaluation=function(options){
if(options!=null&&$.trim(options).length>0){
var options_json_obj ;
try{
if($.type(options)=='string'){
options_json_obj = $.parseJSON(options);
}else if($.type(options)=='object'||$.type(options)=='array'){
options_json_obj = options;
}else{
alert('error options is not string,object,array.');
}
var json_obj_length = options_json_obj.length;
if(json_obj_length!=undefined){//[{},{},{}]...
for(var i=0;i<json_obj_length;i++){
//wait Version 2.0 ...
}
}else{//{}
for(var key in options_json_obj){
var input_obj = $(this).find(":input");
var input_length = input_obj.length;
for(var j=0;j<input_length;j++){
var sub_input_obj = $(input_obj[j]);//input obj
if($.trim(sub_input_obj.attr("name"))==$.trim(key)){
var type = sub_input_obj.attr("type");
var json_value =$.trim(options_json_obj[key]);//json value
if(type=='text'||type=='hidden'||type=='button'||type=='submit'||type=='reset'||type=='password' ){
$(sub_input_obj).attr("value",json_value);
}else if(type=='checkbox'){
var input_value = sub_input_obj.attr("value");
if(json_value.indexOf(",")!=-1){// checkbox many
var array_json_value = json_value.split(",");
for(var
k=0;k<array_json_value.length;k++){
if($.trim(input_value)==array_json_value[k]){
$(sub_input_obj).attr("checked","checked");
}
}
}else{
if($.trim(input_value)==json_value){ $(sub_input_obj).attr("checked","checked");
}
}
}else if(type=='radio'){
var input_value = sub_input_obj.attr("value");
if($.trim(input_value)==json_value){
$(sub_input_obj).attr("checked","checked");
}
}else if(type=='textarea'){
$(sub_input_obj).val(json_value);
}else
if(type=="select-one"||type=="select-multiple"){
$.each($(sub_input_obj).children(),function(i,obj){
if(json_value.indexOf(",")!=-1){
var s_array = json_value.split(",");
for(var
h=0;h<s_array.length;h++){
if(s_array[h]==$.trim($(obj).attr("value"))){
$(obj).attr("selected","selected");
}
}
}else{
if(json_value==$.trim($(obj).attr("value"))){
$(obj).attr("selected","selected");
}
}
});
}
}
}
}
}
}catch(e){
alert('error: options '+e+'. example:{"title":"1"}');
}
}else{
alert('error: options is null or length=0.');
};
};
})(jQuery);
Html:
<head>
<meta -equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" language="javascript" src="./js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="./js/inputEvaluation.js"></script> <title>inuptEvaluation Test</title>
</head>
<body>
<div id="updateform">
<input type="hidden" name="id"/>
<input type="text" name="name"/>
<input type="radio" name="rad" value="1"/>
<input type="radio" name="rad" value="2"/>
<input type="checkbox" name="chec" value="3"/>
<input type="checkbox" name="chec" value="4"/>
<input type="checkbox" name="chec" value="5"/>
<input type="checkbox" name="chec1" value="3"/>
<input type="checkbox" name="chec1" value="4"/>
<input type="checkbox" name="chec1" value="5"/>
<input type="button" name="bu"/>
<input type="submit" name="sub"/>
<input type="reset" name="res"/>
<select name="sel" multiple="multiple">
<option value="1">1</option>
<option value="2">2</option>js获取json的key和value
<option value="3">3</option>
</select>
<select name="selone">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<textarea name="tarea"></textarea>
</div>
<script>
$(function(){
$("#updateform").inputEvaluation($.parseJSON('{"id":"2","name":"1","rad":"2","chec":"3","chec 1":"3,4","bu":"bu","sub":"sub","res":"res","sel":"2,3","selone":"3","tarea":"1333"}'));
/**或者如下
$(function(){
$("#updateform").inputEvaluation('{"id":"2","name":"1","rad":"2","chec":"3","chec1":"3,4","bu": "bu","sub":"sub","res":"res","sel":"2,3","selone":"3","tarea":"1333"}');*/
});
</script>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。