невозможно нажать кнопку в измененном фрейме - PullRequest
0 голосов
/ 18 ноября 2018

Здравствуйте. Я создаю html-страницу, где есть 3 пролета, по которым пользователь может щелкнуть, и каждый пролёт может изменить приведенную ниже строку iframe. Каждый промежуток связан со своей собственной html-страницей, и при щелчке по нему он меняет iframe на свою собственную html-страницу.

Проблема в том, что каждая html-страница имеет свои собственные кнопки с разными кнопками и тому подобное, и в моем js-файле я пытался добавить .click () к каждой кнопке, и по какой-то причине единственный щелчок () работает для основного iframe, который является основным источником iframe до его изменения.

Вот HTML:

<div class="form-group"> 
    <span id="Frame1" class="bla">test 1</span> 
    <span id="Frame1" class="bla">test 2</span> 
    <span id="Frame3" class="bla">test3</span> 
</div>
<iframe src="test_1_Frame.html" style="width: 870px; height: 436px; border: 0;background-color:transparent;" id="frame">

Вот код:

$(".bla").click(function(e) {
    e.preventDefault();
    $("#frame").attr("src", $(this).attr("id")+".html");
    let currentFrame = $(this).attr("id");
    console.log(currentFrame);

    if (currentFrame == "Frame1") {
        console.log(currentFrame);


    } else if (currentFrame == "Frame2") {
        console.log(`${currentFrame} should be Frame2`);

    } else if (currentFrame == "Frame3") {
        console.log(`${currentFrame} should be Frame3`);

    }
});

затем для части щелчка я сделал это:

$(function() {
    $("#frame1_button").click(function() {
        console.log('frame1');

    })
    $("#frame2_button").click(function() {
        console.log('frame2');

    })
     $("#frame3_button").click(function() {
        console.log('frame3');

    })
});

каждая из этих кнопок является отдельной кнопкой в ​​каждом фрейме HTML. но по какой-то причине только «frame1» регистрирует в консоли, когда я нажимаю кнопку frame1_, но когда я нажимаю кнопку frame2 или frame 3, в консоли ничего не регистрируется.

Когда я захожу в консоль и пытаюсь напрямую набрать, чтобы нажать кнопку, ничего не происходит (кнопка не нажата), и я получаю ответ:

enter image description here

Если кто-нибудь знает, почему это происходит, я был бы очень признателен за вашу помощь, заранее спасибо.

(тоже не большая проблема, но мне бы очень хотелось изменить цвет фона текущего выбранного диапазона, поэтому, если кто-нибудь знает, как это сделать, я буду признателен за ответ или комментарий).

1 Ответ

0 голосов
/ 18 ноября 2018

Как насчет этого?

<div class="form-group"> 
    <span id="Frame1" onclick=doSomething(this)>test 1</span> 
    <span id="Frame2" onclick=doSomething(this)>test 2</span> 
    <span id="Frame3" onclick=doSomething(this)>test3</span> 
</div>

<script>
var doSomething = function(element){
console.log(element.id + " was clicked");
}
</script>

С ручкой с кодом здесь ..

С помощью onclick вы можете передать элемент с помощью this, а затем получить доступ к идентификатору.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...