przekazywanie danych formularza do innej strony HTML

Mam dwie strony HTML: formularz.html i wyświetlacz.html. W formie.html, istnieje forma: 

<form action="display.html">
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>

Dane formularza są wysyłane do wyświetlenia.html. Chcę wyświetlić i użyć danych formularza serialNumber w wyświetlaczu.html, jak pokazano poniżej: 

<body>
    <div id="write">
        <p>The serial number is: </p>
    </div>
    <script>
    function show() {
        document.getElementById("write").innerHTML = serialNumber;
    }
    </script>
</body>

Więc jak mogę przekazać zmienną {[2] } z formularza.html do wyświetlenia.html tak, aby powyższy kod był wyświetlany.html pokaże numer seryjny, a funkcja JavaScript show () otrzyma serialNumber z pierwszego HTML?

Author: roy, 2013-02-04
Source

6 answers

Jeśli nie masz możliwości użycia programowania po stronie serwera, takiego jak PHP, możesz użyć ciągu zapytania lub parametrów GET.

W formularzu Dodaj atrybut method="GET": 

<form action="display.html" method="GET">
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>

Po przesłaniu tego formularza, użytkownik zostanie przekierowany na adres, który zawiera wartość serialNumber jako parametr. Coś w stylu: 

http://www.example.com/display.html?serialNumber=XYZ

Powinieneś być w stanie przetworzyć łańcuch zapytania - który będzie zawierał wartość parametru serialNumber - z JavaScript, używając window.location.search wartość: 

// from display.html
document.getElementById("write").innerHTML = window.location.search; // you will have to parse
                                                                     // the query string to extract the
                                                                     // parameter you need

Zobacz także Łańcuch zapytań JavaScript .

Alternatywą jest zapisywanie wartości w plikach cookie podczas przesyłania formularza i odczytywanie ich z plików cookie ponownie po załadowaniu strony display.html.

Zobacz także Jak użyć JavaScript, aby wypełnić formularz na innej stronie .

 28
Author: Richard JP Le Guen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:10:01

Potrzebujesz get wartości z ciągu zapytania (ponieważ nie masz ustawionej metody, domyślnie używasz GET)

Użyj poniższego samouczka.

Http://papermashup.com/read-url-get-variables-withjavascript/ 

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}
 9
Author: Joshua Wooward,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-02-04 19:20:57

Użyj metody "Get", aby wysłać wartość określonego pola przez przeglądarkę: 

<form action="display.html" method="GET">
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>
 2
Author: Satish,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-07-28 05:03:58

Jeśli Twoja sytuacja jest opisana; Musisz wysłać akcję na inny serwelet z jednego formularza i masz dwa przyciski submit i chcesz wysłać każdy przycisk submit na różne strony, wtedy najprostsza odpowiedź jest tutaj.

Do wysyłania danych do dwóch serwletów wykonaj jeden przycisk jako submit, a drugi jako przycisk.Na pierwszym przycisku Wyślij akcję w znaczniku formularza jak zwykle, ale na drugim przycisku wywołaj funkcję JavaScript tutaj musisz przesłać formularz z tym samym polem, ale aby różne serwelety następnie napisz inny znacznik formularza po pierwszym zamknięciu.zadeklaruj tam te same pola tekstowe, ale z ukrytym atrybutem.teraz, gdy wstawiasz dane do pierwszej formy, a następnie wstawiasz je do innej ukrytej formy za pomocą kodu javascript.Napisz jedną funkcję dla drugiego przycisku, który przesyła drugi formularz. Następnie po kliknięciu przycisku submit wykona akcję w pierwszym formularzu, po kliknięciu przycisku wywoła funkcję przesłania drugiego formularza ze swoją akcją. Teraz twój drugi formularz zostanie wezwany do drugi servlet.

Tutaj możesz wywołać dwa serwele z tej samej strony html lub jsp z mieszanym kodem javascript

An przykład drugiej ukrytej formy 

<form class="form-horizontal" method="post" action="IPDBILLING" id="MyForm" role="form">
    <input type="hidden" class="form-control" name="admno" id="ipdId" value="">
</form>
<script type="text/javascript">
    function Print() {
        document.getElementById("MyForm").submit();
    }
</script>
 0
Author: CyberAbhay,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-06-08 18:53:51 
*first html page*

<form action="display.jsp" >
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>


*Second html page*
<body>
<p>The serial number is:<%=request.getParameter("serialNumber") %></p>
</body>


you will get the value of the textbox on another page.
 0
Author: Vna,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-09-20 07:23:50 

<form action="display.html" method="post">
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>

W wyświetlaczu.html należy dodać następujący kod.

<script>
function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

var sn = getParameterByName('serialNumber');

document.getElementById("write").innerHTML = sn;

</script>
 0
Author: Gäñèsh Kàlyâñ Kömmîsëttï,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-09-01 12:46:13