আমাকে একটি ইনপুট ক্ষেত্রে কিছু পাঠ্য সংযোজন করতে হবে ...
আমাকে একটি ইনপুট ক্ষেত্রে কিছু পাঠ্য সংযোজন করতে হবে ...
উত্তর:
$('#input-field-id').val($('#input-field-id').val() + 'more text');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="input-field-id" />
$('#input-field-id')
innerHTML
।
দুটি বিকল্প আছে। আইমানের পন্থা সবচেয়ে সহজ, তবে আমি এটিতে একটি অতিরিক্ত নোট যুক্ত করব। আপনার সত্যিই jQuery নির্বাচনগুলি ক্যাশে করা উচিত, $("#input-field-id")
দুবার কল করার কোনও কারণ নেই :
var input = $( "#input-field-id" );
input.val( input.val() + "more text" );
অন্য বিকল্পটিও .val()
একটি যুক্তি হিসাবে একটি ফাংশন নিতে পারে। একাধিক ইনপুটগুলিতে সহজেই কাজ করার সুবিধা রয়েছে:
$( "input" ).val( function( index, val ) {
return val + "more text";
});
আপনি যদি আরও একবার সংযোজন ব্যবহার করার পরিকল্পনা করে থাকেন তবে আপনি একটি ফাংশন লিখতে চাইতে পারেন:
//Append text to input element
function jQ_append(id_of_input, text){
var input_id = '#'+id_of_input;
$(input_id).val($(input_id).val() + text);
}
আপনি কেবল এটি কল করার পরে:
jQ_append('my_input_id', 'add this text');
আপনি সম্ভবত ভাল () খুঁজছেন
// Define appendVal by extending JQuery
$.fn.appendVal = function( TextToAppend ) {
return $(this).val(
$(this).val() + TextToAppend
);
};
//_____________________________________________
// And that's how to use it:
$('#SomeID')
.appendVal( 'This text was just added' )
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<textarea
id = "SomeID"
value = "ValueText"
type = "text"
>Current NodeText
</textarea>
</form>
আচ্ছা এই উদাহরণটি তৈরি করার সময় আমি কিছুটা বিভ্রান্ত হয়ে পড়েছিলাম। " ভ্যালু টেক্সট " বনাম> বর্তমান নোডেক্সট < মান মানটির.val()
ডেটাতে চালিত হওয়ার কথা নয় ? যাইহোক আমি এবং আপনি আমাকে তাড়াতাড়ি বা পরে পরিষ্কার করতে পারেন।
তবে আপাতত বিষয়টি হ'ল:
ফর্ম ডেটা নিয়ে কাজ করার সময় .val () ব্যবহার করুন ।
ট্যাগের মধ্যে বেশিরভাগ পঠনযোগ্য ডেটা ব্যবহার করার সময় .text () বা ব্যবহার করুনকরার সময় পাঠ্য সংযোজন .append () ব্যবহার করুন।
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<style type="text/css">
*{
font-family: arial;
font-size: 15px;
}
</style>
</head>
<body>
<button id="more">More</button><br/><br/>
<div>
User Name : <input type="text" class="users"/><br/><br/>
</div>
<button id="btn_data">Send Data</button>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#more').on('click',function(x){
var textMore = "User Name : <input type='text' class='users'/><br/><br/>";
$("div").append(textMore);
});
$('#btn_data').on('click',function(x){
var users=$(".users");
$(users).each(function(i, e) {
console.log($(e).val());
});
})
});
</script>
</body>
</html>