当前位置：首页 → 问答吧 → jquery dialog插件（jquery-impromptu）

jquery dialog插件（jquery-impromptu）

时间：2009-03-28

来源：互联网

官方网站：http://trentrichardson.com/Impromptu/index.php
考虑到一些朋友看英文比较累，小第我就做一些简单的翻译啦，谢谢大家的掌声，谢谢。
实例演示：

[table=1061][tr][td]1 最简单的调用
代码
$.prompt('Example 1');

[/td][/tr][/table]

2.加一些不同值的按钮
代码:
$.prompt('Example 2',{ buttons: { Ok: true, Cancel: false } });

改变覆盖渐变的不透明度：
代码：
$.prompt('Example 3',{ opacity: 0.2 });
演示
由于是一个动态过程这里就不上图拉，^_^

改变默认的聚焦按钮：
代码：
$.prompt('Example 4',{ buttons: { Ok: true, Cancel: false }, focus: 1 });

改变所有css名的前缀：
代码
$.prompt('Example 5',{ prefix: 'impromptu' });

改变显示的动态效果：
代码
$.prompt('Example 6',{ show:'slideDown' });
这里是动画效果，所以也不上图了，^_^

使用自己定义的动态效果：
代码
jQuery.fn.extend({
      myanimation: function(speed){
            var t = $(this);
            if(t.css("display") == "none")
                  t.show(speed,function(){
                  t.hide(speed,function(){
                  t.show(speed); }); });
            else
                  t.hide(speed,function(){
                  t.show(speed,function(){
                  t.hide(speed); }); });
      }
});

$.prompt('Example 7',{ show:'myanimation' });

加一个callback函数：
代码一
function mycallbackfunc(v,m,f){
      $.prompt('i clicked ' + v);
}
$.prompt('Example 8',{ callback: mycallbackfunc });
代码二
var txt = 'Please enter your name:<br />
      <input type="text" id="alertName"
      name="alertName" value="name here" />';

function mycallbackform(v,m,f){
      $.prompt(v +' ' + f.alertName);
}

$.prompt(txt,{
      callback: mycallbackform,
      buttons: { Hey: 'Hello', Bye: 'Good Bye' }
});

代码三
var txt = 'Try submitting an empty field:<br />
      <input type="text" id="alertName"
      name="myname" value="" />';

function mysubmitfunc(v,m,f){
      an = m.children('#alertName');
      if(f.alertName == ""){
            an.css("border","solid #ff0000 1px");
            return false;
      }
      return true;
}

$.prompt(txt,{
      submit: mysubmitfunc,
      buttons: { Ok:true }
});

加圆角：
代码
$.prompt('Example 11',{prefix:'impromptu'}).children('#impromptu').corner();

css前缀圆角等混合使用：
代码
$.prompt('Example 12<p>Save these settings?</p>',{
buttons:{ Apply:1,Maybe:2,Never:3 },
prefix:'colsJqi',
}).children('#colsJqi').corner();

一个简单的例子：
代码
var statesdemo = {
      state0: {
            html:'test 1.<br />test 1..<br />test 1...',
            buttons: { Cancel: false, Next: true },
            focus: 1,
            submit:function(v,m,f){
                  if(!v) return true;
                  else
                        $.ImpromptuGoToState('state1');
                  return false;
            }
      },
      state1: {
            html:'test 2',
            buttons: { Back: -1, Exit: 0 },
            focus: 1,
            submit:function(v,m,f){
                  if(v==0) jQuery.ImpromptuClose()
                  else if(v=-1)
                        $.ImpromptuGoToState('state0');
                  return false;
            }
      }
};

$.prompt(statesdemo);

演示你们看这里：
http://trentrichardson.com/Impromptu/demos/demostates.html

作者: jacksuc 发布时间: 2009-03-28

jquery dialog插件（jquery-impromptu）

热门阅读

热门下载