riot实现spinner标签

html in spinner.tag

<div class="input-group {opts.class} spinner" data-trigger="spinner" name="spinner">
          <input type="text" class="form-control text-center" id="{opts.name}" value="{opts.value}" data-rule="{rule}">
          <div class="input-group-addon">
            <a href="javascript:;" class="spin-up" data-spin="up"><i class="fa fa-caret-up"></i></a>
            <a href="javascript:;" class="spin-down" data-spin="down"><i class="fa fa-caret-down"></i></a>
          </div>
      </div>

js in spinner.tag

 <script>        
        var ths=this;  
      	this.on("mount",function(){
      		if(!opts.changed)
      		opts.changed=function(e, newVal, oldVal) {
   				if(opts.trigger)
   				  opts.trigger("changed",e,newVal,oldVal);
      		};
      		if(!opts.changing)
      		opts.changing=function(e,newVal,oldVal){
      			if(opts.trigger)
   				  opts.trigger("changing",e,newVal,oldVal);
      		}
      		//alert(JSON.stringify(opts,null,2));
      		debugger;
      		$(this.spinner).spinner(opts);   			
      	})
      </script>

在页面中引用spinner标签

 <spinner name="spinner1" class="input-group-sm"></spinner>

<script>
		$(document).ready(function(){
			var param={};
			riot.observable(param);
			riot.mount("*",param);
			param.on("changed",function(e,newVal,oldVal){
				$(e.target).parents(".show").children(".result").text("changed:"+$(e.target).attr("id")+"="+newVal);
			});
			param.on("changing",function(e,newVal,oldVal){
				$(e.target).parents(".show").children(".result").text("changed:"+$(e.target).attr("id")+"="+newVal);
			});
		});

		</script>