Как отобразить несколько внешних веб-страниц в html div несколькими нажатиями кнопок?

Question

Я создал 2 кнопки и показываю один раз внешнюю веб-страницу, используя тег. Например, я хочу, чтобы при нажатии кнопки 1 отображалась веб-страница1, а при нажатии кнопки 2 - веб-страница2.

Мой тег объекта:

<object id="obj" type="text/html" data="http://127.0.0.1:8080"> </object>

Буду признателен за помощь.

Полный код:

<div class="inner-container">

<button type="button" id="surface_btn" >B1</button>
<br>
<button type="button" id="steering_btn">B2</button>
</div>
<div class="d1">
<object id="obj" type="text/html" data="URL" name="search"></object>
</div>

Answer 1

function loadintodiv(page, target) {
$.ajax({
  method: "GET",
  url: page,
  success: function(data){ target.append(data);}
});
}

В вашем html ...

<div id=“target1”></div>
 <div id=“target2”></div>
<button onclick=‘loadintodiv(“/page1”, $(“#target1”))’></button>
<button onclick=‘loadintodiv(“/page2”, $(“#target1”))’></button>

Это загрузит данные со страниц, которые вы запрашиваете, в целевой элемент.