I am using jquery. If I have a div that looks like this:
<div class="container" title="Mark">
and I run:
find('div.container["title=Mark"]');
then it works. Which means, the element is found.
However, if I have another div that looks like this:
<div class="container" title="Mark Person">
then it doesnt work. Which means: the element is not found and jquery give an exception:
Error, Syntax Error: unrecognized expression.
It seems that when "title" is a string with no whitespaces or other characters like slash, then it works. In other case, jquery doesnt understand that tag.
is there a way to avoid changing in my code everywhere (it is a lot of changes) and make find-function to work with this elements?
You've got your " marks in the wrong place. Place them around the value:
var mp = $(document).find('[title="Mark Person"]');
mp.css('font-weight', 'bold');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container" title="Mark Person">should be bold</div>
<div class="container" title="Mark">should not be bold</div>
Related
The code below prints out 333'> when using jQuery. I don't know if I did something wrong there.
$('#test').append("<div id='").append("333").append("'></div>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div id="test"></div>
It looks like there's a missing quotation mark at the end of the string being appended. Try changing the line of code to the following:
$('#test').append("<div id='333'></div>");
This should fix the issue and produce the desired output.
I've got div on my page with id attribute with escaped HTML for example:
<div class="myDiv" id="<script>alert(1)</script>></div>
Can I with JavaScript and JQuery take the value of this attribute as it is coded? Using just $('.myDiv').attr('id) im just getting <script>alert(1)</script> and I have to know if this HTML has already been escaped :O
Just need to get this attribute in JS as <script>alert(1)</script>
https://i.stack.imgur.com/vXmVK.png
You might consider something safer. You must also wrap it properly. Your example is missing a closing Quote.
<div class="myDiv" id="myDiv-1" data-script="alert(1)"></div>
You could also do it this way.
<div class="myDiv" id="myDiv-1" data-script="<script>alert(1)</script>"></div>
Again this is not good practice. You may want to consider another method.
I want to get an HTML element with a jQuery selector and print out all its contents (either in an alert or console debug). Something like this...
<div class="mydiv">Hello is it me you are looking for?</div>
<script>
alert("But I still haven't found what I am looking for " + $("#mydiv").html());
</script>
I also tried printElement as suggested in this post, but that doesn't seem to work either.
Here is a simple fiddle.
The # is the id selector. You have a class (<div class="mydiv">) so you need to use the class selector .:
alert("But I still haven't found what I am looking for " + $(".mydiv").html());
Wrap the content for which you want to print HTML element.
<div id="myHtml">
<div class="mydiv">Hello is it me you are looking for?</div>
</div>
<script>
alert($("#myHtml").html())
</script>
I upgraded to the latest version of JsViews and it seems like something broke.
If I have a data-link like "visible{:property}", it works.
If I have a data-link like "visible{convert:property}", it does not work.
From what I can tell it seems like it looks early on in the process for the attr "visible" and changes it to "css-display". When I have a converter, though, in propertyChangeHandler it does this line
attr = linkCtx.attr || attr; // linkCtx.attr may have been set to tag.attr during tag instantiation in renderTag
That causes it to change attr back to "visible", and then in updateContent, the regex test for "css-" fails and it never sets the display property.
Am I missing something? Shouldn't this work?
I created a fiddle that shows what I am trying to do. In the non-working case, instead of setting display:none, it sets visible="false"
http://jsfiddle.net/4scbgjpx/2/
<script id="worksTempl" type="text/x-jsrender">
<div data-link="visible{:show}">
<span data-link="name"></span>
</div>
</script>
<script id="failsTempl" type="text/x-jsrender">
<div data-link="visible{negate:show}">
<span data-link="name"></span>
</div>
</script>
$.views.converters({
"negate": function (val) { return !val; }
});
Yes, you are right - that was a bug. It has been fixed now (commit 58), and your jsfiddle now works correctly.
I'm awful with javascript and I'm having a problem with this one.
I'm using this code
<script>
function changeNavigation(id){
document.getElementById('members')
.innerHTML=document.getElementById(id).innerHTML
}
</script>
and HTML
`<span onClick="changeNavigation('members')" >MEMBERS</span>
<span onClick="changeNavigation('help')" >HELP</span>`
<div id="members>...</div>
<div id="help" style="display: none;>...</div>
But I can't get <span onClick="changeNavigation('members')" >MEMBERS</span> to actually go to an element "members" without duplicating everything inside of it in another id.
Is there a way to do this?
This can be done using only standard javascript, but personally I'd recommend going ahead and getting used to using jQuery. Here's an example jsfiddle using jQuery: http://jsfiddle.net/JnvCR/2/
Don't forget to include jQuery in your website:
<script src="http://code.jquery.com/jquery.js"></script>
You need to correct your syntax errors. Use onclick instead of onClick (pedantic). Make sure you close your attributes properly, you are missing a few closing " marks.
updated html
<span onclick="changeNavigation('members')" >MEMBERS</span>
<span onclick="changeNavigation('help')" >HELP</span>`
<div id="members">...</div>
<div id="help" style="display: none;">...</div>
There is also an error with your logic as you are simply replacing the contents of div#members with itself.
Updated JS without syntax errors, but still with dodgy logic
function changeNavigation(id){
document.getElementById('members').innerHTML=document.getElementById(id).innerHTML;
}
Demo fiddle
http://jsfiddle.net/ADGCV/
As far as your actual question goes, can you explain what you would like to happen a bit better??
Here's a possible solution http://jsfiddle.net/ADGCV/1/