我想在一个文本框中连接两个或多个文本框值。这里我使用id获取值，但是这个id将动态添加，这意味着文本框将动态添加。为动态添加文本框我用于循环但是我只得到最后一个文本框值的值，因为循环执行。我想要所有的文本框值。请帮我把我弄出来。谢谢你提前。
以下是动态文本框处理的代码：
这是在servlet中使用printwriter对象
int nums=5;
out.println("<input type='text' id='static'>");
int i;
for (i=0;i<nums; i++) {
out.println("<input type='text' Style='width:30px' maxlength='1' id='id"+i+"'onkeyup='sum();'> ");
out.println("<script>function sum(){ alert('id"+i+"'); var txtFirstNumberValue=document.getElementById('id'+i+'').value;var result = document.getElementById('static').value + txtFirstNumberValue;alert(result);if (isNaN(result)){ document.getElementById('static').value = result; }}</script>");
}
但是如果我使用静态文本框我会得到我需要的东西，但我需要在动态过程中。
这是静态文本框过程的代码：
<input type="text" maxlength="1" id="1" onkeyup="sum();"/>
<input type="text" maxlength="1" id="2" onkeyup="sum();"/>
<input type="text" maxlength="1" id="3" onkeyup="sum();"/>
<input type="text" id="4"/>
function sum() {
var txtFirstNumberValue = document.getElementById('1').value;
var txtSecondNumberValue = document.getElementById('2').value;
var txtThirdNumberValue = document.getElementById('3').value;
var result = txtFirstNumberValue + txtSecondNumberValue + txtThirdNumberValue;
if (isNaN(result)) {
document.getElementById('4').value = result;
}
}
请帮我找出解决方案。提前谢谢你。
答案 0 :(得分：5)
我不会使用内联JavaScript，如果我真的需要它，我会给我的元素正确的ID，否则我会使用类。
$(document).ready(function() {
$('.in').on('input',function() {
var allvals = $('.in').map(function() {
return this.value;
}).get().join('');
$('.out').val( allvals );
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="in" type="text" maxlength="1" id="i1"/>
<input class="in" type="text" maxlength="1" id="i2"/>
<input class="in" type="text" maxlength="1" id="i3"/>
<input class="out" type="text" id="i4"/>
答案 1 :(得分：0)
<script type="text/javascript">
$(document).ready(function(){
var cls = document.getElementsByClassName('test');
var i =0;
var len = cls.length;
var tot = 0;
for(i=0;i<l;i++){
var cur = cls[i].value;
tot = parseInt(cur)+tot;
}
//document.getElementById("id"+cls.length).value = tot; //set the value for last element as the tot var
});
</script>
<body>
<input type="text" maxlength="1" value="1" id="1" class="test"/>
<input type="text" maxlength="1" value="2" id="2" class="test"/>
<input type="text" maxlength="1" value="3" id="3" class="test"/>
</body>
答案 2 :(得分：0)
$(document).ready(function() {
$('.in').on('input',function() {
var allvals = $('.in').map(function() { return this.value; }).get().join('');
$('.out').val( allvals );
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="in" type="text" maxlength="1" id="i1"/>
<input class="in" type="text" maxlength="1" id="i2"/>
<input class="in" type="text" maxlength="1" id="i3"/>
<input class="out" type="text" id="i4"/>
答案 3 :(得分：0)
/**
* The following class, using an extension with the RecyclerView.Adapter, manages the actions to
* do on the RecyclerView and allows actions performed by the user
*/
private class ImageGalleryAdapter extends RecyclerView.Adapter<ImageGalleryAdapter.MyViewHolder> {
@Override
public ImageGalleryAdapter.MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
Log.i(TAG_THIS_CLASS, "Beginning of ImageGalleryAdapter");
Context context = parent.getContext();
LayoutInflater inflater = LayoutInflater.from(context);
// Inflate the layout
View photoView = inflater.inflate(R.layout.item_photo, parent, false);
ImageGalleryAdapter.MyViewHolder viewHolder = new ImageGalleryAdapter.MyViewHolder(photoView);
return viewHolder;
}
@Override
public void onBindViewHolder(ImageGalleryAdapter.MyViewHolder holder, int position) {
PreviewPhotosInGallery previewPhotoInGallery = mPhotosToPreviewInGallery[position];
ImageView imageView = holder.mPhotoImageView;
GlideApp.with(mContext)
.load(previewPhotoInGallery.getUrl())
.placeholder(R.drawable.ic_cloud_off_red)
.into(imageView);
}
/**
* The method for giving back the number of items to load as photo.
*/
@Override
public int getItemCount() {
return (mPhotosToPreviewInGallery.length);
}
/**
* The class that assigns a view holder for each Image and checkbox in the RecyclerView.
*/
public class MyViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener, View.OnLongClickListener {
public ImageView mPhotoImageView;
public CheckBox mPhotoCheckBox;
public MyViewHolder(View itemView) {
super(itemView);
mPhotoImageView = (ImageView) itemView.findViewById(R.id.item_photo_iv);
mPhotoCheckBox = (CheckBox) itemView.findViewById(R.id.item_photo_checkbox);
itemView.setOnClickListener(this);
itemView.setOnLongClickListener(this);
}
/**
* The method for managing the click on an image.
*/
@Override
public void onClick(View view) {
itemSelection(view);
}
/**
* Manages the selection of the items.
*/
private void itemSelection (View item){
Log.i(TAG_THIS_CLASS, "getAdapterPosition " + getAdapterPosition());
int position = getAdapterPosition();
if(position != RecyclerView.NO_POSITION) {
if (!item.isSelected()){
// Add clicked item to the selected ones
selectedItems [position] = true;
// Checking the number of items selected
int number_of_items_selected = getResult();
// Enabling the button multiPSASendPhoto_BTN
multiPSASendPhoto_BTN.setEnabled(true);
if (number_of_items_selected == 1){
multiPSASendPhoto_BTN.setText(R.string.spsm_button_for_sending_photo);
}
else {
multiPSASendPhoto_BTN.setText(R.string.mpsm_button_for_sending_photos);
}
// Visually highlighting the ImageView
item.setSelected(true);
mPhotoCheckBox.setChecked(true);
mPhotoCheckBox.setVisibility(View.VISIBLE);
}
else {
// Remove clicked item from the selected ones
selectedItems [position] = false;
// Checking the number of items selected
int number_of_items_selected = getResult();
// Disabling the button multiPSASendPhoto_BTN if selectedItems contains no elements
if (number_of_items_selected == 0){
multiPSASendPhoto_BTN.setEnabled(false);
multiPSASendPhoto_BTN.setText(R.string.mpsm_button_for_sending_photos);
}
else if (number_of_items_selected == 1){
multiPSASendPhoto_BTN.setText(R.string.spsm_button_for_sending_photo);
}
else {
multiPSASendPhoto_BTN.setText(R.string.mpsm_button_for_sending_photos);
}
// Removing the visual highlights on the ImageView
item.setSelected(false);
mPhotoCheckBox.setChecked(false);
mPhotoCheckBox.setVisibility(View.INVISIBLE);
}
}
Log.i(TAG_THIS_CLASS, "selectedItems " + selectedItems.toString());
}
/**
* This method counts the number of elements selected in the gallery.
*/
public int getResult() {
int count = 0;
for (int i =0; i< selectedItems.length ; i++) {
if (selectedItems[i]){
count ++;
}
}
return count;
}
/**
* The method for managing the long click on an image.
*/
@Override
public boolean onLongClick(View view) {
int position = getAdapterPosition();
if(position != RecyclerView.NO_POSITION) {
PreviewPhotosInGallery previewPhotoInGallery = mPhotosToPreviewInGallery[position];
Intent intent = new Intent(mContext, PreviewSinglePhotoActivity.class);
intent.putExtra(PreviewSinglePhotoActivity.EXTRA_PHOTO, previewPhotoInGallery);
startActivity(intent);
}
// return true to indicate that the click was handled (if you return false onClick will be triggered too)
return true;
}
}
private PreviewPhotosInGallery[] mPhotosToPreviewInGallery;
private Context mContext;
public ImageGalleryAdapter(Context context, PreviewPhotosInGallery[] photosToPreviewInGallery) {
mContext = context;
mPhotosToPreviewInGallery = photosToPreviewInGallery;
}
}
$(document).ready(function() {
$('.in').on('input',function() {
var allvals = $('.in').map(function() {
return this.value;
}).get().join('');
$('.out').val( allvals );
});
});