jQueryとLinkBut​​tons、または通常のボタンとCSS

asp.net controls css jquery postback
jQueryとLinkBut​​tons、または通常のボタンとCSS

マスターページに小さなログインコントロールがあります。 ログインコントロールでは、見た目が好きなので、[送信]ボタンにLinkBut​​tonを使用しています。

ただし、jQueryを使用して、ログインコントロールのテキストボックスで「Enter」キーが押されたことをキャプチャしています。 すべてのブラウザーでjQueryを使用してリンクボタンのクリックイベントをトリガーすることは困難です。 doPostBackをハードコーディングすることも試みましたが、LinkBut​​ton IDは、コントロールの組み込みのhref = “ doPostBack”属性にあるものとわずかに異なります。 .trigger()、click()などに応答しません。

一方、通常のButtonコントロールはjQuery click()で正常に機能します。 しかし、私はボタンの見た目が好きではなく、CSSスキルは限られています。 通常のASP.NETボタンコントロールをリンクのようにスタイルする簡単な方法はありますか? または、LinkBut​​tonをjQueryで動作させる簡単な方法はありますか? 必要な労力が少ない方を選択します。 🙂

前もって感謝します。

  3  0


ベストアンサー

ClientScriptManagerを使用して、LinkBut​​tonが起動する正確なJavaScriptを取得できます。

string postbackFunction = this.Page.ScriptManager.GetPostBackEventReference(myLinkButton, "");

string jQueryBlock = @"$('#loginbox').keypress(function(e){
    if(e.which == 13) {" + postbackFunction + ";}});

//print the jQueryBlock to the page

次のようなJS関数呼び出しが出力されます。

__doPostBack('linkButtonID','', 0);

2


確かに、CSSで および要素をスタイルすることは問題ではありません:

input.button,
button {
    margin: 0;
    padding: 0;

    color: blue;
    background: none;
    border: 0;

    cursor: pointer;
}

http://jsfiddle.net/UuybN/ [こちら]のように見えます。

ただし、注意が必要なことの1つは、ボタンスタイリングが常に一貫してクロスブラウザーに適用されるわけではないことです。 http://www.456bereastreet.com/lab/form_controls/buttons/ [ここに投稿]は、さまざまなブラウザーとOSでのレンダリングの違いを示しています。 つまり、ターゲットブラウザが上記を正しく適用していることを確認してください。

0


タイトルとURLをコピーしました