Question

说我有：

--
-- Table structure for table `property_amenities`
--

CREATE TABLE `property_amenities` (
  `amenity_id` int(11) NOT NULL,
  `amenity_name` varchar(60) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--
-- Dumping data for table `property_amenities`
--

INSERT INTO `property_amenities` (`amenity_id`, `amenity_name`) VALUES
(1, 'Outdoor Balcony'),
(2, 'Outdoor Yard Access'),
(3, 'Large Windows/Natural Light'),
(4, 'Closet Space'),
(5, 'Storage Space'),
(6, 'Laundry in Unit'),
(7, 'Parking Garage'),
(8, 'Ample Parking'),
(9, 'Stainless Steel Appliances'),
(10, 'Open Floor Plan'),
(11, 'Newly Renovated'),
(12, 'Close to Social Amenities'),
(13, 'Swimming Pool'),
(14, 'Courtyard'),
(15, 'Electric Fence'),
(16, 'Intercom'),
(17, 'Patio'),
(18, 'Internet'),
(19, 'Guest Quarters'),
(20, 'Gym / Workout Room'),
(21, 'Kitchenette'),
(22, 'Day And Night Guards'),
(23, 'Borehole'),
(24, 'Street Lights'),
(25, '3 Phase Power'),
(26, 'Dhobi Area'),
(27, 'Wheelchair Access '),
(28, 'Generator');

如何在一行中使用全部三个或两个，如：

var varOne = $('#varOne'),
varTwo = $('#varTwo'),
varThree = $('#varThree');

Answer 1

将您的匿名函数转换为命名函数并从三个事件中调用它：

varOne.on('click', myClickEvent);
varTwo.on('click', myClickEvent);
varThree.on('click', myClickEvent);

function myClickEvent() {
    // code here
}

或者，如果您只是为了创建事件而使用变量，那么您不需要它们，您可以直接使用这些ID：

$("#varOne", "#varTwo", "#varThree").on('click', function(){
    // code here
});

注意结尾处的分号。虽然是可选的，但强烈建议适当使用分号。

Answer 2

一次将您的事件处理程序附加到多个选择器

$("#varOne, #varTwo, #varThree").on('click', function(){
  // code here
});

工作示例： -

$(document).ready(function(){
  var varOne = $('#varOne');
  varTwo = $('#varTwo');
  varThree = $('#varThree');
  $("#varOne, #varTwo, #varThree").on('click', function(){
    console.log($(this).html());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="varOne">div1</div>
<div id="varTwo">div2</div>
<div id="varThree">div3</div>

Answer 3

$.add()：

创建一个新的jQuery对象，其中元素已添加到匹配元素集中。

var combinedElements = varOne.add(varTwo).add(varThree);

combinedElements.on("click", function() {

});

或者

var combinedElements = $.fn.add.call(varOne, varTwo, varThree);

combinedElements.on("click", function() {

});

示例：

＆＃13;

var varOne = $("#varOne"),
    varTwo = $("#varTwo"),
    varThree = $("#varThree"),
    combinedElements = varOne.add(varTwo).add(varThree);

combinedElements.on('click', function(){
  console.log($(this).html());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="varOne">div1</div>
<div id="varTwo">div2</div>
<div id="varThree">div3</div>

＆＃13;

Answer 4

您应该使用代表。

如果您的3个选择器共享父级，您可以将事件监听器添加到该父级ONE TIME，并要求我监听这三个元素中的任何一个。

$.on('click','put, selectors, here', function(){ ... })

https://jsfiddle.net/sq8v5twL

http://api.jquery.com/on/

在表达式中使用多个变量

4 个答案: