Selector
Find by multi classes
<element class="a b">
$('.a.b')
$('.b.a')
Find the last element
<div id='hello'>
<p class='world'>a</p/>
<p class='world'>b</p/>
<p class='world'>c</p/>
</div>
$(#hello).find('.world:last')
// => c
form
metaprogramming like form submit
Good for grecapcha call-back v2 workaround.
onSubmit = function(){
const formName = $('.agreement').find('input').attr('name').split('[')[0]
$(`form[id*=${formName}]`)submit();
}
stop event bubbling
event.preventDefault();
Manipulation
add/append a element
It appends hidden input that gives a param 'force_invalid'.
<form class="my-form">
</form>
function invalid_submit(document) {
$(document).append("<input name='force_invalid' value='1' type='hidden'></input>" );
$(document).closest('form').submit();
}
set a value
$('input[name="some_request[policy_agreement]"]').val("0");
if checkbox is checked, open a panel
$.each($(".checkbox"), function(){
// scope of 'this' is the checkbox
if($(this).is(":checked")){
$(this).closest("div").slideToggle("fast");
}
});
Tips
expression substitution inside a string literal. (式展開)
${}
inside the backquote (`) substitute the expression.
const formName = 'my-form'
$(`form[id*=${formName}]`)submit();
$('form[id*=`formName`]').submit(); // ❌doesn't work
$('form[id*=formName]').submit(); // ❌doesn't work
Uncaught Syntaxerror: Unexpected token u
It's same as console.log(JSON.parse(undefined));
.
JSON.parse is actually undefined.
Top comments (0)