用戶輸入到HTML標簽輸出

Question

好吧，我正在嘗試的一個例子。

用戶輸入： http : //google.com

我希望輸出為：

 <script> $(document).ready(function() { // Handler for .ready() called. $("#change-it").click(function() { var userLink = $('#usr-input').val().replace(/.*?:\\/\\//g, ""); $('#users-text').text('<a href="' + userLink + '" ><img src="rainbow.gif"></a>'); $('#user-link').attr('href', 'http://' + userLink); }); }); </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="text" class="form-control" id="usr-input"> <br> <button id="change-it" type="button">Update Text</button> <br> <div id="users-text"></div> <br> <a id="user-link" href="#" target="_blank"> <img src="http://orig09.deviantart.net/8364/f/2014/053/f/9/free_space_galaxy_texture_by_lyshastra-d77gofi.png" /> </a> 

我該如何使用Javascript？

問候。

Answer 1

因此，您希望將用戶輸入設置為以下鏈接上的href嗎？

 $(document).ready(function() { // Handler for .ready() called. $("#change-it").click(function() { var userLink = $('#usr-input').val().replace(/.*?:\\/\\//g, ""); $('#users-text').text('<a href="' + userLink + '" ><img src="rainbow.gif"></a>'); $('#user-link').attr('href', 'http://' + userLink); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="text" class="form-control" id="usr-input"> <br> <button id="change-it" type="button">Update Text</button> <br> <div id="users-text"></div> <br> <a id="user-link" href="#" target="_blank"> <img src="http://orig09.deviantart.net/8364/f/2014/053/f/9/free_space_galaxy_texture_by_lyshastra-d77gofi.png" /> </a> 

Answer 2

首先獲取元素，即通過其ID：var element = document.getElementById（“ element id”）

然后更改href屬性：element.href =“ your string”