использовать JQuery для вставки div на мою страницу в другую часть моей страницы

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

У меня есть эта таблица. Статическая. У меня пять кнопок и пять ответных div. Когда я нажимаю кнопку, я хочу, чтобы таблица была помещена в соответствующий ответ div.

что-то вроде.

$("#button1").button().click($("#div1").append($("#mytable"));

и так далее. Это можно сделать? Как?

Также, пожалуйста, скажите мне, если есть лучший способ сделать это, если я пытаюсь заново изобретать колесо или что-то подобное ...

РАБОЧАЯ:

код, который я в конечном итоге используя, исходя от решений:

$("#test").button().click(function() { $("#test2").append($("#table_EditInformation")); });

тест кнопка test2 является ДИВ table_EditInforation, очевидно, таблица

источник

2010-12-08 kralco626

Я должен отметить, что я не хочу помещать 5 страниц таблицы на страницу, по одному в каждом div, и скрывать/показывать, когда нажимается кнопка, хотя я знаю, что она сработает. – kralco626 2010-12-08 13:37:37

для рабочего примера скопируйте html/js ниже в файл index.html или любой .html и попробуйте его.

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" ></script> 
<script> 
$(document).ready(function(){ 
$("#button1").click(function() { 
     $("#div1").empty().append($("#mytable")); 
}); 
}); 
</script> 
</head> 
<body> 
<a href="#" id="button1">the link or button to be pressed</a> 
<div id="div1"> 
    <p>stuff should be put here</p> 
</div> 
<table id="mytable"> 
    <tr> 
     <td>put my table in the div please! </td> 
    </tr> 
</table> 
</body> 
</html>

равнину Javascript код следующим образом:

$("#button1").click(function() { 
    $("#div1").append($("#mytable")); 
    });

помнится, элемент с идентификатором $ ("# MyTable") должен быть в том же йот дерева.

также вы можете использовать .empty() перед .append(), чтобы опустошить содержание #div

как это:

$("#button1").click(function() { 
    $("#div1").empty().append($("#mytable")); 
    });

Проверьте документацию здесь jquery.html()

источник

2010-12-08 13:44:02 mahatmanich

+1, это также можно улучшить, чтобы найти родительский DIV кнопки, тем самым сохраняя необходимость жесткого кодирования идентификатора, но это только бонус. :) – 2010-12-08 13:46:36

Так что, похоже, моя главная проблема была в том, что я не сказал .html() – kralco626 2010-12-08 14:17:21

$("#button1").click(function(){ 
    $("#div1").append($("#mytable")); 
    });

Должно ли это сделать

источник

2010-12-08 13:47:11 Mantar

function appendTableTo(divId) { 
    $('#mytable') 
    .remove()    // take the table out of whatever div it's in 
    .appendTo(divId);  // and place it into the right div 
} 

function addHandler(buttonId, divId) { 
    $(buttonId).button().click(
    function(divId){ 
     return function(){ 
     appendTableTo($(divId)); 
     }; 
    }(divId) 
); 
} 

addHandler('#button1', '#div1'); 
addHandler('#button2', '#div2'); 
addHandler('#button3', '#div3'); 
addHandler('#button4', '#div4'); 
addHandler('#button5', '#div5');

Это должно сделать это. У нас есть только одна функция append, которая помещает таблицу в правый div. Кроме того, у нас есть функция, которая привязывает этот обработчик кликов к кнопке. И мы называем это пять раз.

Функция addHandler использует замыкание. Это необходимо, потому что нам нужно передать аргумент функции appendTableTo, и это невозможно в противном случае.

источник

2010-12-08 14:02:48 travelboy

использовать JQuery для вставки div на мою страницу в другую часть моей страницы

ответ

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