i'm doing a goto link in web page, with an input text aside it.
the goto link appear both on top and bottom of webpage.
<div class="gotopage">
goto page<input type="text" class="page_i"/>
Go
</div>
in jquery, i need to get text beside link:
$('a.Goto').live('click',function(){
window.location.href = ...;
});
how to get text value, it shouldn't be id, for id appear twice.
Use prev() to get sibling text input:
$('a.Goto').live('click',function(){
window.location.href = $(this).prev('.page_i').val();
});
Wrap the text in a span tag:
<div class="gotopage">
<span>goto page</span><input type="text" class="page_i"/>
Go
</div>
Then select it
$('a.Goto').live('click',function(){
window.location.href = $(this).closest('span').text();
});
You can get text of an input box by using this code
<script>
$('a.Goto').live('click',function(){
txt=$('.gotopage .page_i').val();
alert(txt);
});
</script>
Related
I am using a contentEditable div and want to get the text inside it when a submit is called. I tried this.refs.textarea.value.trim() but that doesn't seem to work. My code is as follows in the render return
<div><form onSubmit={this.handleSubmit} id="noter-save-form" method="POST">
<div id="noter-text-area" contentEditable="true" ref="textarea">{value}</div>
and the handleSubmit function.
handleSubmit: function(e) {
e.preventDefault();
var text = this.refs.textarea.value.trim();
alert(text);
this.saveFile(text);
},
Thanks for the help. I am just looking to replace the text variable with what is actually inside the editable div.
if it's a div it doesn't matter if it's editable and should be this.refs.textarea.innerHTML and if you just want text this.refs.textarea.innerText
This works for me! hope this help
handleSubmit: function(e) {
e.preventDefault();
let text = e.currentTarget.textContent;
alert(text);
this.saveFile(text);
},
I want to create a custom "X" close or hide button, image, text that works for a complete element box in wordpress. I've attached a sample image of the "x" on something else. For my site however I need it to control the whole element or (tiles) on my page not just the single box of text.
Sample image
This is a easy task for you, basically on this situation what you have to do is create the "x" graphic with any iconfont or you can use the "X" from any font(like a regular x that you just have to touch your keyboard) then what you have to do is follow this example.
HTML
<div class="yourbox">
<!--- THIS IS THE BOX THAT YOU WANT TO CLOSE, you can use id or clas whatever you want-->
<p> text or content of the box <p>
<a id="close"href=""> X </a>
</div>
CSS
.yourbox{
height:100px;
width:400px;
background-color: red;
}
JS
<script type="text/javascript">
$(function() {
$("#close").click(function () {
$( "#yourbox" ).css( "display", "none" );
});
});
</script>
You could name the function as you want, use class instead of id and basically the code will hie the div after you touch the " X ".
So, I'm having trouble trying to figure out how to make the 2 left divs (volunteer sign-up and Request a volunteer) on my home page be clickable links. I currently have them change color when you hover over them but how do I make them link to there appropriate page. Any help w
http://partners.sbceo.org
Wrap the div in an anchor tag.
<a href="your-link-here">
<div></div>
</a>
<div class="mydiv" data-href="http://stackoverflow.com"></div>
<script>
$('.mydiv').on('click', function(){
window.location = $(this).data('href');
})
</script>
this way you could use more than one clickable div
Give the div a class or other identifier. Then using jQuery do something like:
$('identifier').click(function(){
window.location = "your url";
});
None jQuery:
<div id="hello"></div>
function linkTo(url){
window.location = url;
}
el = document.getElementById('hello');
el.onclick = linkTo('some website');
i can't see the link but you can do this using Javascript:
<div style="cursor: pointer;" onclick="window.location='http://google.com/'">
</div>
If a text input tag is placed inside an anchor, then in Firefox (on Windows) it is not possible to manipulate text inside the text box — text cursor doesn't change its position, and it is not possible to select the text. In Chrome you can change cursor position, but not select the text.
In some cases we can set the parent to be something else than anchor, yet is there a way to avoid this behaviour in general?
Here's the HTML code:
<p>No text select in FF:</p>
<a href="#">
<input type="text" value="7777" />
</a>
<p>Working text select in FF:</p>
<span>
<input type="text" value="8888" />
</span>
And the fiddle.
You can remove the href attribute when the input element is focused. As long as there is no href attribute, you will be able to select text inside the input field (tested in safari, chrome and firefox).
<a href="http://www.google.de" id="link">
link
<input type="text" id="input">
</a>
(function () {
var link = document.getElementById('link');
var input = document.getElementById('input');
var saveHref = null;
input.addEventListener('focusin', function () {
savedHref = link.href;
link.removeAttribute('href');
});
input.addEventListener('focusout', function () {
link.href = savedHref;
savedHref = null;
});
})();
Working example:
http://codepen.io/jjd/pen/JYwLVr
its because of the implementation error in browser.
actualy when we clicking browser it will look for the type of object
in this way
1.is this a link
2.is this any other type( input area,image,
why it first checking for type "link"
because clickig is firstly implemented for opening links,
anf its main usage is for open links
it detect first it as a link then it will call the
. openlink(example) function
<input type="text" id="example"></input>
<div id="test"></div>
Is there anyway I can make text entered in #example appear in #test?
You have to use Javascript. Basically, with jQuery:
$("#example").change(function(){
$("#test").html($("#test").html() + $("#example").html());
});
this will do the trick:
$('#example').keyup(function(){
$('#test').val(this.value);
});