как по-разному обрабатывать различные параметры выбора даты на одной странице - PullRequest
Новая
       30

как по-разному обрабатывать различные параметры выбора даты на одной странице

0 голосов
/ 05 января 2012

У меня есть 2 сборщика данных на одной странице.Одним из них является имя datePicker1, а другим datePicker2.На самом деле у меня есть код 

$(".ui-state-active").parents('tr').css("border", "1px solid Green");
        $(".ui-datepicker-calendar tbody tr").live('click', function(){
           $(".ui-datepicker-calendar tbody tr:nth-child(" + ($(this).index() + 1) + ")").css("border", "1px solid Green");
        });

Я хочу, чтобы вышеуказанный код работал только для datePicker1, а не 2. На самом деле проблема в том, что код работает на обоих средствах выбора даты.Как я могу заставить его работать только для datePicker1?

Ответы [ 3 ]

0 голосов
/ 05 января 2012

Дайте объекту datepicker идентификатор или, что еще лучше, присвойте его родителю идентификатор и выберите этот конкретный элемент вместо универсального класса.

0 голосов
/ 05 января 2012

Прежде всего, вы не должны использовать .live().Он потребляет ресурсы и фактически устарел.

Вот хороший способ сделать это с делегатом: 

$("body").on('click', '.ui-datepicker-calendar tbody tr', function(){
       $(this).next().css("border", "1px solid Green");
 });

Плохая вещь в том, что, несмотря на это, нет простого способа определить, какойполе ввода запустило средство выбора даты.

Я бы подключил событие .focus() к полям средства выбора даты и добавил класс, если это поле, на которое вы хотите воздействовать, в противном случае удалите его.

Примерно так: 

$(".datepicker").focus(function() { 
    if ($(this).attr("id") == "datePicker1") {
        $("#ui-datepicker-div").addClass("greenBorders");
    } 
    else {
        $("#ui-datepicker-div").removeClass("greenBorders");
    }
});

А затем обновите приведенный выше код следующим образом: 

$("body").on('click', '.greenBorders ui-datepicker-calendar tbody tr', function(){
       $(this).next().css("border", "1px solid Green");
 });
0 голосов
/ 05 января 2012

Я не совсем уверен, где указано ваше имя, но если у вас есть атрибут name в элементе .ui-datepicker-calendar, попробуйте это с помощью: 

$(".ui-state-active").parents('tr').css("border", "1px solid Green");
    $(".ui-datepicker-calendar[name=datePicker1] tbody tr").live('click', function(){
       $(".ui-datepicker-calendar tbody tr:nth-child(" + ($(this).index() + 1) + ")").css("border", "1px solid Green");
    });

В противном случае было бы здорово, если бы вы могли предоставить jsfiddle с кодом.

...