Как вы берете ввод пользователя и добавляете его в URL в iframe? - PullRequest
1 голос
/ 28 марта 2020

Я пытаюсь создать веб-сайт, который имеет несколько поисковых систем и сравнивает результаты

Пока у меня есть

<!DOCTYPE html>

<html lang="en">
    <head>
        <title>fact checker</title>
    </head>
    <body>
        <form method="get" action="https://www.dogpile.com/search">
        <input type="text" name="q" size="31" value="">
        </form>

        <iframe id="Dogpile"
        title="Dogpile"
        width="1000"
        height="1500"
        src="https://www.dogpile.com">
    </iframe>
</html>

Я бы хотел взять ввод формы и открыть поиск в iframe вместо того, чтобы открывать его на другой странице (с действием = "https://www.dogpile.com/search")

Можете ли вы сохранить ввод как переменную с помощью Javascript? Будет ли это работать?

 input = "https://www.dogpile.com/serp?q=" + input;

Я не планирую выкладывать это онлайн, я просто делаю это для практики кодирования

Спасибо

1 Ответ

0 голосов
/ 28 марта 2020

Вы можете принять ввод с помощью document.querySelector

> let input = document.querySelector('input[name="q"]')

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector

И если вы хотите добавить его в действие формы, вы можете использовать

$('form').on('submit',(el)=>{
   //Here we select currentTarget value(input value)
    let input = document.querySelector('input[name="q"]')
   //Here we change action form, .attr() with 1 param you get value of attr, if you 
   //put a second param you set the value of that attribute
   $('form').attr('action',$('form').attr('action')+input)
})

Что делает код в $ ('form'). On () получает его значение и добавляет входное значение

https://api.jquery.com/attr/

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