当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - Meteor app - on input focus show edit button, and on unfocus hide the edit button

问题描述:

I'm developing a feedback app, and I need to show the edit button near the edit input wherever I focus on it, and on unfocus I need to hide it. Below is the source code:

HTML file

{{#if isOwner}}

<input id="edit" class="edit" type="text" placeholder="edit" /><input type="submit" id="save" value="save" style="display:none;"/>

{{/if}}

<div id="replyBody" style="display:none;">

<input type="text" id="replyText" placeholder="reply text" /><input type="submit" value="reply" style="margin-left:15px;"/>

</div>

JS file

Template.task.events({

'focus .edit':function(event){

$("#save").show();

},

});

Further more, for example, if I have 5 feedbacks, and a reply button on every feedback, if I click on the second's feedback reply button it's just like i clicked on the first one. And the same with the other feebacks.

Thank you in advance!

网友答案:

You can make differentiate between them by using a unique identity like their id if any or any other unique value:

HTML:

{{#if isOwner}}
  <input id="{{uniqueThingHere}}_edit" class="edit" type="text" placeholder="edit" /><input type="submit" id="{{uniqueThingHere}}_save" value="save" style="display:none;"/>
{{/if}}

JS File

Template.task.events({
'focus .edit':function(event){
     var id = $(event.target).attr(id).split('_')[0];
     $("#" + id + '_save').show();
 },
});
分享给朋友:
您可能感兴趣的文章:
随机阅读: