Как я могу вставить переменную в iframe src, чтобы достичь felixibilty для открытия различных сайтов? (автор: HTML-страница и JavaScript) - PullRequest
0 голосов
/ 02 сентября 2018

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

Действительно, мне нужен код типа ниже:

<html>
    <body>
        <script type="text/javascript">
            var userInput_stringVariable= "this part is user desired input string" ;
            var adress= "https://en.wikipedia.org/wiki/" + userInput_stringVariable ;
        </script>
        <iframe src=adress width="100%" height="100%" frameborder="0"></iframe>
    </body>
</html>

Этот код не работает, а мне нужен такой код для работы!

Ответы [ 2 ]

0 голосов
/ 02 сентября 2018

Текстовое поле, в котором пользователь может ввести то, что он хочет найти на wikipedia или на любом другом веб-сайте, который вы хотите, кнопку отправки, которая будет вызывать функцию после нажатия. answer.value даст значение текстового поля, и оно будет объединено с website initial url.

HTML

<input type="text" name="inputField" id="answer" placeholder="Enter what you wanna search">
<button type="button" name="button" onclick="mySubmit()">Submit</button>
<iframe id="search" src="" width="100%" height="100%" frameborder="0"></iframe>

Сценарий

<script>
function mySubmit() {
        let getInput = answer.value;
        var address;
        address = "https://en.wikipedia.org/wiki/" + getInput;
        document.getElementById('search').src = address;
}
</script>
0 голосов
/ 02 сентября 2018

Вот функция, которая, вероятно, будет делать то, что вы хотите:

<script type="text/javascript">
function selectPage() {
var userImput_stringVariable = prompt("desired imput string");

if (userImput_stringVariable != null) {
    document.getElementById("getPage").innerHTML =
    "<iframe width='100%' height='100%' src='https://en.wikipedia.org/wiki/" + userImput_stringVariable + "'></iframe>";
}
}
</script>

Просто добавьте

    <body onload="selectPage()">

где-то в теле, поэтому функция запускается, когда работает страница.

Откроется приглашение, затем пользователь должен будет ввести адрес.

Также вам понадобится это в теле:

    <p id="getPage"></p>

Создает абзац с содержимым iframe внутри функции.

...