javascript - How can I simplify this repetitive jquery? -

यह कोड मुझे एक कस्टम संदेश प्रदर्शित / छुपा देता है msg_one msg_two msg_three जब उचित डिवी कवर किया गया है / छिपा हुआ है उपयुक्त संदेश को #screen div में इंजेक्ट किया जाता है और दिखाता है / छिपाना तब लागू होता है कोड लगभग 2 लाइनों #one vs #two vs #three और संदेश प्रदर्शित किए जाने के अलावा लगभग समान है msg_one msg_two msg_three ।

मैं पुनरावृत्ति से छुटकारा पाने के लिए इसे कम लाइन में कैसे सरल कर सकता हूं?

  var msg_one = "message 1"; Var msg_two = "संदेश 2"; Var msg_three = "संदेश 3"; $ ("# एक")। होवर (फ़ंक्शन () {$ ("# स्क्रीन")। Html (msg_one)। दिखाएं ();}, फ़ंक्शन () {$ ("# screen")। Html ("") ।छिपाना();  }); $ ("# दो")। होवर (फ़ंक्शन () {$ ("# स्क्रीन")। Html (msg_two)। दिखाएं ();}, फ़ंक्शन () {$ ("# screen")। Html ("") ।छिपाना();  }); $ ("# तीन")। हॉवर (फ़ंक्शन () {$ ("# स्क्रीन")। Html (msg_three)। दिखाएं ();}, फ़ंक्शन () {$ ("# screen")। Html ("") ।छिपाना();  });  

धन्यवाद

आप jQuery का विस्तार कर सकते हैं, जैसे:

  $ .fn .hover_message = function (message) {$ (this) .bind ("hover", function () {$ ("# screen")। Html (message)। Show ();}, function () {$ ("# स्क्रीन ")। Html (" ")। Hide ();}); }  

और फ़ंक्शन का उपयोग करें, जैसे:

  $ ("# एक")। Hover_message (msg_one); । $ ( "# दो") hover_message (msg_two); । $ ( "# तीन") hover_message (msg_three);