switch contenteditable attr
Why does the line obj.attr(b, 'false').blur(); not work? What is wrong here?
$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>jquery contenteditable
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
add a comment |
Why does the line obj.attr(b, 'false').blur(); not work? What is wrong here?
$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>jquery contenteditable
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
@Mohammad, removingblur- doesn't work too.
– user7461846
Nov 14 '18 at 8:56
add a comment |
Why does the line obj.attr(b, 'false').blur(); not work? What is wrong here?
$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>jquery contenteditable
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
Why does the line obj.attr(b, 'false').blur(); not work? What is wrong here?
$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>$('#btnren').on('click', function()
let obj = $('#cptitlea');
let b = 'contenteditable';
if (obj.attr(b, 'false'))
obj.attr(b, 'true').focus(); // this works
else
obj.attr(b, 'false').blur(); // doesn't work
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>jquery contenteditable
jquery contenteditable
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
edited Nov 14 '18 at 8:58
Rory McCrossan
247k29213253
247k29213253
asked Nov 14 '18 at 8:49
user7461846
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
@Mohammad, removingblur- doesn't work too.
– user7461846
Nov 14 '18 at 8:56
add a comment |
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
@Mohammad, removingblur- doesn't work too.
– user7461846
Nov 14 '18 at 8:56
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
@Mohammad, removing
blur - doesn't work too.– user7461846
Nov 14 '18 at 8:56
@Mohammad, removing
blur - doesn't work too.– user7461846
Nov 14 '18 at 8:56
add a comment |
1 Answer
1
active
oldest
votes
The issue is because you're using the setter of attr() in the if statement. This means your if is actually saying 'if (jQuery object exists)', which is always true.
To fix this, use the getter of attr() to retrieve the value and use it in the if statement. Note that you can simplify the logic by providing a function to attr() which returns the new value to be set, based on the current one. Try this:
$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53296161%2fswitch-contenteditable-attr%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
The issue is because you're using the setter of attr() in the if statement. This means your if is actually saying 'if (jQuery object exists)', which is always true.
To fix this, use the getter of attr() to retrieve the value and use it in the if statement. Note that you can simplify the logic by providing a function to attr() which returns the new value to be set, based on the current one. Try this:
$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
add a comment |
The issue is because you're using the setter of attr() in the if statement. This means your if is actually saying 'if (jQuery object exists)', which is always true.
To fix this, use the getter of attr() to retrieve the value and use it in the if statement. Note that you can simplify the logic by providing a function to attr() which returns the new value to be set, based on the current one. Try this:
$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
add a comment |
The issue is because you're using the setter of attr() in the if statement. This means your if is actually saying 'if (jQuery object exists)', which is always true.
To fix this, use the getter of attr() to retrieve the value and use it in the if statement. Note that you can simplify the logic by providing a function to attr() which returns the new value to be set, based on the current one. Try this:
$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
The issue is because you're using the setter of attr() in the if statement. This means your if is actually saying 'if (jQuery object exists)', which is always true.
To fix this, use the getter of attr() to retrieve the value and use it in the if statement. Note that you can simplify the logic by providing a function to attr() which returns the new value to be set, based on the current one. Try this:
$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>$('#btnren').on('click', function()
let $el = $('#cptitlea');
let b = 'contenteditable';
$el.attr(b, function(i, v)
return v === 'true' ? false : true;
).focus();
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='cptitlea'>323</div>
<br>
<button id='btnren'>CLICK</button>answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
edited Nov 14 '18 at 8:57
answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
answered Nov 14 '18 at 8:51
Rory McCrossanRory McCrossan
247k29213253
247k29213253
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
add a comment |
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
it works, thanks, especially for simplified logic
– user7461846
Nov 14 '18 at 9:02
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53296161%2fswitch-contenteditable-attr%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Because when you click on button, div becomes blurred
– Mohammad
Nov 14 '18 at 8:51
@Mohammad, removing
blur- doesn't work too.– user7461846
Nov 14 '18 at 8:56