1

qtipを使用して、qtipに表示される埋め込みフォームを作成しようとしています。フォームへの送信イベントを作成しようとしても、何も起こりません。jquery1.7と最新のqtipバージョンを使用しています。

http://craigsworks.com/projects/qtip2/demos/の例を使用しようとしましたが、それらのデモは機能しません。私のコードを見て、何か間違ったことをしているのか教えてください。

前もって感謝します！

$("#addNews").qtip({
    position: {
       corner: {
          target: 'bottomMiddle',
          tooltip: 'topMiddle'
       },
       adjust: { x: 0, y: 0 }
    },
    show: {
        when: { event: 'click' },
        solo: true
    },
    hide: {
        fixed: true,
        when: { event: 'unfocus' }
    },
    content: { 
        text: '<form id="frmAddNews"><div class="inputWrap left"><div class="label">Rubrik</div><input type="text" id="" name="" class="inputText" value="" /></div><div class="inputWrap left"><div class="labelTextarea">Meddelande</div><textarea id="" name="" class="inputTextarea" value=""></textarea></div><div class="submit_container"><input type="submit" value="Lägg till nyhet" /></div><div style="clear:both"></div></form>',
    },
    style: {
        border: {
            width: 5,
            radius: 2,
            color: '#e1e1e1'
        },
        width: 350,
        background: '#FFF',
        padding: 15,
        tip: true, // Give it a speech bubble tip with automatic corner detection
        name: 'cream' // Style it according to the preset 'cream' style
    },
    events: {
       render: function(event, api) {
             $('form', this).bind('submit', function(event) {
                 event.preventDefault();
                 console.log("hej");
             });
        }
    },
});
4

1 に答える 1

1

簡単にプレイして、ツールチップをモーダルに表示するように設定すると、動作するようになりました。

つまり、showオプション オブジェクトを次のようにします。

show: {
     event: 'click', // Show it on click...
     modal: {
        on: true,

        // Don't let users exit the modal in any way
        blur: false, escape: false
     }
},

私が遊んでいたjsFiddle。

于 2012-03-06T08:22:42.230 に答える