0

Помогите разобраться , не могу понять в чем ошибка.. В общем задача следуюшая , нужно что бы вытягивался элемент из html по клику на нем и предположим выводилось значение этого элемента alertом.

window.onload=function(){
    gtClassName('B');
}


function gtClassName(nameClass){
    with(this){
        ObjectAdd = document.getElementsByClassName(nameClass);
        ObjectAdd.addEventListener('click' , outDate);
        function outDate(){
            alert(this);
        }

    }
}

Проделывал такое с помощью jq, но на чистом js не получается. При выборке по id работает, а по классу выдает в консоли ошибку:

TypeError: ObjectAdd.addEventListener is not a function;

И если указать ObjectAdd с индексом то тоже все сработает. Подскажите как сделать так , что бы процесс не требовал обращения к циклам , иначе как можно через this это сделать?

Заранее cпасибо!

0

2 ответа 2

1

Решается с помощью итерации как и было сказано пользователем Mr. Brightside, вот собственно и решение:

       window.onload = function(){
       var p = new getClassAndBinding();
        p.getValAndClick(Имя класса в HTML);
        }
      function getClassAndBinding(){

     this.getValAndClick = function(NameClass){

    this.getCls = document.getElementsByClassName(NameClass);
    for(i = 0;i<this.getCls.length;i++){
      this.getCls[i].addEventListener('click' , function(){
            alert(this.value);
    });}

        }}
0

Конечно, будет ошибка, ведь вам возвращается массив объектов, с заданным классом (читать доку тут). Если вы подставите ObjectAdd[0], то событие должно срабатывать для первого элемента.

Вы можете воспользоваться чем-нибудь подобным:

window.onload=function(){
    document.addEventListener('click' , function(e) {
        e = e || window.event;
        var target = e.target || e.srcElement,
            text = target.textContent || text.innerText; 
        alert(text);
    });
};

Однако, тут событие будет выводить уведомление при любом клике в любое место документа.

Согласно указанной выше документации, использование getElementsByClassName позволяет получить дочерние элементы только нужного элемента, и обрабатывать клики, соответственно, только для них. Однако, боюсь, без итерации тут не обойтись.

3
  • Спасибо, решил..
    – shimba
    23 мая 2016 в 18:23
  • вы можете опубликовать своё решение здесь, чтобы другие участники, столкнувшись с такой же задачей, могли воспользоваться вашим решением. 24 мая 2016 в 9:48
  • @Mr.Brightside, лучше сказать не массив, а коллекция
    – Grundy
    24 мая 2016 в 18:46

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.