Целевой конкретный div после отправки формы в iframe.

Question

Вот мои настройки ...

У меня есть две страницы, index.html и cart.html.У меня есть форма на index.html, которая при отправке загружает cart.html во всплывающем окне iframe.Это отлично работает.

Когда я загружаю cart.html в iframe, он загружает всю страницу cart.html, показывая заголовок / меню / фон, который совпадает с index.html.Но это проблема, мне нужно иметь возможность загрузить cart.html в iframe, но затем нацелить div с идентификатором «cart-content».Мне нужно показать только этот div, а не всю страницу.

Чтобы обойти эту проблему, можно просто стилизовать cart.html, чтобы он помещался в iframe без заголовков / меню / фонов и без него, но мне нужно иметь возможность просматривать cart.html вне iframe.

вот моя форма:

<form id="product-form" method="post" action="/cart">
<!-- BIG CARTEL CONTENT, NOT IMPORTANT -->
</form>

Я использую плагин jQuery FaceBox, чтобы открыть iFrame.Вот его код:

jQuery('#product-form').submit(function() {
    jQuery.facebox('<iframe name="targetbox"></iframe>');
    return true;
}).prop('target','target box')

Итак, в форме мне нужно, чтобы это действие было чем-то вроде "/ cart # cart-content".Надеюсь, кто-то может помочь!Спасибо

Answer 1

Проверьте это: iframe, чтобы показать только определенную часть страницы

По сути, используйте функцию load для загрузки страницы cart.html и выберите div для той страницы, которую вы хотите отобразить - т.е.

$('#popUpDiv').load('path-to-my-page/cart.html #divToDisplay')

В этом случае #divToDisplay - это идентификатор фрагмента cart.html, который вы хотите загрузить во всплывающее окно.

Примечание. Последняя отправка ответа Пойнти -

.

Могут быть и другие вещи, которые вам нужно сделать, и существенная разница является то, что контент станет частью главной страницы, а не выделены в отдельное окно.

Возможно, вам придется учесть это, если вы отправляете из загруженного div.

НТН