Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
In the following example, how can I make the image source variable and related to a text input, so that after tapping the image link it appear instantly without reloading the page?
<input style="text" name="img_link" placeholder="tape your image link" />
<img src="" />
Just assign an event to your input, so that when it changes, update the src of the image.
There's a runnable snippet below. Any time you press a key in the input, or when the input loses focus, the image will automatically be updated.
$(function() {
$("input").get(0).focus();
$("input").on("blur keydown", function() {
$("img").attr("src", $(this).val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input tyle="text" name="img_link" placeholder="tape your image link" value="http://lorempixel.com/100/100/" />
<img src="" />
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
I have one long page of content. If I want to create a search bar so that when the user searches something that exists somewhere on the single page, it redirects them to that part of the page (like it goes to the middle or the bottom of the page). Does this require any back-end like PHP or can I do this with just HTML?
You can make use of window.find() in JavaScript
Reference: https://developer.mozilla.org/en-US/docs/Web/API/Window/find
Demo:
function search(string){
window.find(string);
}
<input placeholder="type foo or bar" type="text" id="search">
<input type="button" value="Go" onclick="search(document.getElementById('search').value)">
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<p>foo</p>
<p>bar</p>
<p>hello world</p>
Easiest thing to do would be some javascript
<input id="searchText"><button onclick="search()">Search</button>
<script>
function search() {
var searchText = $("#searchBar").val();
$(".searchText:contains('" + searchText + "')").css("background","#FF0");
}
</script>
<div class=".searchText">Some kind of text would go here</div>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
<div id="dynamicInput">
</div>
At run time I am generating form in this div. Once a button is pressed I want all the included content to be transfered to another HTML page div tag.
Is it possible?
you can use like this with html and javascript :
<div id="staticinput">bla bla</div>
<div id="dynamicInput">here your ramdom content</div>
<form action="./your_page_result" method="post">
<input name="content" id="content" type="hidden"/>
<input type="submit" name="submit" value="submit" onclick="document.getElementById('content').value=document.getElementById('dynamicInput').innerHTML">
</form>
so in this case :
the form will send the content to another page that you specify in action
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
i am doing a social network website in asp.net c#, so i want to pop up this alert box after pressing the post button when it's empty.
i have used this code as requiredfieldvalidater , but it's pop up for every button i pressed
<asp:TextBox ID="TextBox1" runat="server" required="required" placeholder=" What is in your mind" style="margin-left: 17px; margin-top: 14px" BorderStyle="Groove" TextMode="MultiLine" Font-Size="Large" OnTextChanged="TextBox1_TextChanged" ValidationGroup="a" ></asp:TextBox>
so i want another code Like this
could somebody tell me how to get this?
make an audio file element
<audio src="pop.mp3" id="pop_sound"></audio>
then in javascript just add the onclick handler
<script>
document.getElementById('TextBox1').addEventListener('keypress',function(e){
if(e.keyCode===YOURKEY){
document.getElementById('pop_sound').play();
alert('YOUR MESSAGE!');
}
});
</script>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
How do I insert html tag inside of script?
Here is how I'm trying:
document.Tick.Clock.value=hours+"<span>:</span>"+minutes+":"
Original:
document.Tick.Clock.value=hours+":"+minutes+":"
Since your html element has a value property I assume it's an input. If it is then you can set the value including html tags:
<input type="text" id="mytext" />
<script>
document.getElementById("mytext").value="<p>helo</p>"
</script>
If your html element is not an input element then you should set innerHTML:
<div id="mytext"></div>
<script>
document.getElementById("mytext").innerHTML="<p>helo</p>"
</script>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Is there a way to add a link to an image using an input box, let say you have an image uploaded and you have an input,
Image Link: <input type="text" id="image_link"/>
in this box a user types in www.google.com
and you want the link to append to the image.
Is there a way to do this?
Did you mean something like this:
http://jsfiddle.net/2QRBm/ ?
HTML:
<input/>
<button>set link</button>
<img src="http://media.heavy.com/post_assets/2010/03/0417/1267743226_stoned-party-dog-original.jpg" width="300"/>
Javascript:
$('img').wrap($('<a/>',{href:'',target:'_blank'}));
$('button').click(function(){
var val=$('input').val();
$('img').closest('a').attr('href',val.replace(/^([^(http://)].*)/,'http://$1'));
});
Lets say your image have this id: #img
Then you can use jQuery wrap to wrap the image into a a element:
$('input').change(function(){
$('#img').wrap('')
})
DOCS: http://api.jquery.com/wrap/
Something like this: live demo
HTML:
<input type="text" id="test"/> <input type="button" id="go" value="go"/>
JavaScript:
$("#go").click(function(){
var value = $("#test").val();
window.location = "http://"+value+"";
});