3

私は次のコードを醜くしないようにしようとしていますが、どうしたらよいかわかりません。皆さんからの提案はありますか？どうもありがとう。 

  if($element.is('builder') || $element.is('#options') ){
     tooltipYPos=yPos + 35; 
    }

  if($element.is('#button')){
     tooltipXPos=xPos - 240; 
    }
  if($element.is('#addn')){
     tooltipXPos=xPos - 295; 
     tooltipYPos=yPos - 80; 
    }  


   if($element.is('#count')){
     tooltipXPos=xPos + 180; 
     tooltipYPos=yPos - 90; 
    } 
   if($element.is('label')){
       tooltipXPos=xPos + 80; 
     tooltipYPos=yPos - 90; 
   }
4

4 に答える 4

2

一般的な解決策は、問題をコードからデータに移すことです。1 つの解決策 (以下で説明) は、さまざまな ID タグをキーとする JavaScript 連想配列を設定することです。値は値のペア X および Y オフセットです (場合によっては、一方または他方が 0 です)。使用時に、連想配列のキーをループして一致を探します。その場合、連想配列からの X オフセットと Y オフセットを toolTipXPos と toolTipYPos に追加します。

これにより、オフセットが邪魔にならないように 1 か所に保持され、オフセットを操作するコードが短くシンプルになります。

（テストされていない、当然）

// This can be stashed away anywhere.
var a = {
    '#te_classbuilder':              { X: 0,    Y: 35  },
    '#te_options':                   { X: 0,    Y: 35  },
    '#lesson-details-extend-button': { X: -240, Y: 0   },
    '#asset-list-asset-add-button':  { X: 295,  Y: -80 },
    '#asmnt_option_label_q_count':   { X: 180,  Y: -90 },
    "label":                         { X: 80,   Y: -90 }
}

// Put this where you need the actual evaluation to happen  
jQuery.each(data, function(key, value) {
    if ( $element.is(key) ) {
        tooltipXPos = xPos + value.X;
        tooltipYPos = yPos + value.Y;
    }
});

編集: ループに変更されたので、labelではなく についてテストできます#label。

于 2012-08-23T16:34:18.057 に答える
1

別のオプションは.data、次のように、要素自体に適切な X 値と Y 値を格納するために jQuery の関数を利用することです。

$('label').data({ x: 80, y: -90 });
$('#te_classbuilder, #te_options').data({ x: 0, y: 35 });
$('#lesson-details-extend-button').data({ x: -240, y: 0 });
$('#asset-list-asset-add-button').data({ x: -295, y: -80 });
$('#asmnt_option_label_q_count').data({ x: 180, y: -90 });

その後、ツールチップの位置の値を変更するときは、条件ステートメントは必要ありません。xからおよびyデータ属性を取得するだけ$elementです。

tooltipXPos = xPos + $element.data('x');
tooltipYPos = yPos + $element.data('y');

もちろん、これは、割り当てられる可能性のある要素が、適切な値と値で$element以前に.data呼び出されていることを前提としています。xy

于 2012-08-23T17:01:40.423 に答える
0

デルタをハードコーディングする代わりに、 $element の高さ/幅を計算し、それに応じて tooltipXPos/tooltipYPos を変更できますか?

于 2012-08-23T16:21:30.783 に答える
0

最初に、条件を組み合わせることができる場合:

if ($element.is('#te_classbuilder, #te_options')) {
  tooltipYPos = yPos + 35; 
}

大きな変更ができない場合は、次のように記述します。

if ($element.is('#te_classbuilder, #te_options')) tooltip = { x: 0,          y: yPos + 35 };
if ($element.is('#lesson-details-extend-button')) tooltip = { x: xPos - 240, y: 0 };
if ($element.is('#asset-list-asset-add-button'))  tooltip = { x: xPos - 295, y: yPos - 80 };
if ($element.is('#asmnt_option_label_q_count'))   tooltip = { x: xPos + 180, y: yPos - 90 };
if ($element.is('label'))                         tooltip = { x: xPos + 80;  y: yPos - 90 };
于 2012-08-23T16:22:05.737 に答える