«эта» функция работает неправильно

-1

У меня есть таблица с множеством td. Когда я нажимаю кнопку, мне нужны некоторые элементы html внутри td. Как я могу решить эту функцию, используя «это»?«эта» функция работает неправильно

$(document).ready(function() { 
 
      $("button").click(function clickMe(e) { 
 
       $(this).html ("this is hai") 
 
      }); 
 
     });

table td { 
 
    border: 1px solid; 
 
    border-color: lightgray; 
 
    overflow:hidden; 
 
    height:17px; 
 
    /*max-height:10px;*/ 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
<table style="border-collapse:collapse;border:1px solid;width:10%;height:100px;margin-top:50px;"> 
 
     <tr> 
 
      <td id="container"onclick="clickMe(this)"></td> 
 
      <td></td> 
 
      <td></td> 
 
     </tr> 
 
    </table> 
 
    <button id="container" > clickme</button> 
 
    </body> 
 
    </html>

источник

2016-06-24 manu padmanabhan

** 1. ** ID должно быть уникальным. ** 2. ** 'clickMe' - _local_ в' ready() '. ** 3. ** Не должно быть места в '.html (' – Tushar

также после того, как вы измените свой идентификатор на класс (что было бы предпочтительнее), тогда вы можете использовать его в jquery $ ('. Container'). ('click', function clickMe (e) {...}) и удалите onclick из html. –

, пожалуйста, дайте мне идеальный скрипт, используя этот –

изменение:

<html> 
 
<head></head> 
 
    <body> 
 
     <table id="table_id"> 
 
      <tr> 
 
       <td>Td</td> 
 
       <td></td> 
 
       <td></td> 
 
      </tr> 
 
     </table> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
     <script> 
 
      $(document).ready(function() { 
 
       $("#table_id td").on("click",function(){ 
 
        $(this).html("this is hai"); 
 
      }) 
 
     })   
 
     </script> 
 
    </body> 
 
</html>

источник

2016-06-24 10:04:50 Ehsan

Так что вы хотите resuse функцию ClickMe? Затем вы должны поместить его по всему миру и удалить параметр, который не нужен.

Btw: дублирование идентификаторов является плохой практикой, но это будет работать:

редактировать: Вы должны использовать onclick="clickMe.call(this)", чтобы связать текущий элемент this в функции ClickMe.

function clickMe() { 
 
    $(this).html ("this is hai") 
 
} 
 

 
$(document).ready(function() { 
 
    $("button").click(clickMe); 
 
});

table td { 
 
    border: 1px solid; 
 
    border-color: lightgray; 
 
    overflow:hidden; 
 
    height:17px; 
 
    /*max-height:10px;*/ 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
<table style="border-collapse:collapse;border:1px solid;width:10%;height:100px;margin-top:50px;"> 
 
     <tr> 
 
      <td id="container" onclick="clickMe.call(this)"></td> 
 
      <td></td> 
 
      <td></td> 
 
     </tr> 
 
    </table> 
 
    <button id="container" > clickme</button> 
 
    </body> 
 
    </html>

источник

2016-06-24 10:06:29 MattDiMu

$(document).ready(function() { 
 
    $("#table_id td").on("click", function(){ 
 
    $(this).html("this is hai"); 
 
    }); 
 
});

#table_id td { 
 
    border: 1px solid; 
 
    border-color: lightgray; 
 
    overflow:hidden; 
 
    height:17px; 
 
} 
 

 
#table_id{ 
 
    width:100%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
    <table id="table_id"> 
 
     <tr> 
 
      <td></td> 
 
      <td></td> 
 
      <td></td> 
 
     </tr> 
 
    </table> 
 
    </body> 
 
</html>

Я действительно не знаю, что вы хотите, это, как это?

источник

2016-06-24 10:06:40

Если вы просто хотите, чтобы контент был размещен в контейнере ИЛИ просто попробуйте это:

//it is unclear to me _what you exactly want_ if _this_ is <b>not</b> what you want. Give me a comment on _what is not correct_ and i'll try to edit goodluck!

$('#my_button').on('click', function(){ 
 
$('#place_here').html ("this is hai") 
 

 
});

table td { 
 
    border: 1px solid; 
 
    border-color: lightgray; 
 
    overflow:hidden; 
 
    height:17px; 
 
    /*max-height:10px;*/ 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <body> 
 
<table style="border-collapse:collapse;border:1px solid;width:10%;height:100px;margin-top:50px;"> 
 
     <tr> 
 
      <td id="container"></td> 
 
      <td id="place_here"></td> 
 
      <td></td> 
 
     </tr> 
 
    </table> 
 
    <button id="my_button"> clickme</button> 
 
    </body>

источник

2016-06-24 10:08:54

Вы должны понять, как jQuery и javascript работы, ваш код не имеет никакого смысла. Помните, что идентификатор должен быть уникальным, вам лучше использовать класс, если вам нужно реализовать его на странице несколько раз. Я создал демо, чтобы вы могли понять, как должен работать скрипт.

Я сделал вашу кнопку, что при нажатии будет заполнено 3-х тв, обратите внимание, что я ссылаюсь на TD со своим ID на jQuery нажатием кнопки события. После заполнения TD вы сможете щелкнуть каждый TD, и он выведет свой HTML-контент. См. Сценарий ниже.

 $(document).ready(function() { 
 
       $("button").click(function(e) { 
 
        $("#td1").html ("this is hai displayed at td1"); 
 
        $("#td2").html ("this is hai displayed at td2"); 
 
        $("#td3").html ("this is hai displayed at td3"); 
 
       }); 
 
      
 
       window.clickMe = function (data){ 
 
       alert(jQuery(data).html()); 
 
       } 
 
      });

 table td { 
 
     border: 1px solid; 
 
     border-color: lightgray; 
 
     overflow:hidden; 
 
     height:17px; 
 
     /*max-height:10px;*/ 
 

 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <html> 
 
     <body> 
 
    <table style="border-collapse:collapse;border:1px solid;width:10%;height:100px;margin-top:50px;" > 
 
      <tr> 
 
       <td id="td1" onclick="clickMe(this)"></td> 
 
       <td id="td2" onclick="clickMe(this)"></td> 
 
       <td id="td3" onclick="clickMe(this)"></td> 
 
      </tr> 
 
     </table> 
 
     <button id="container" > clickme</button> 
 
     </body> 
 
     </html>

источник

2016-06-24 10:16:20

«эта» функция работает неправильно

ответ

Смежные вопросы