如何在表tr jquery中获取选择框值

时间：2016-10-28 07:00:14

标签： javascript jquery

如何在更改事件中选择框值。

使用此jquery代码仅获取第一个选择框值。

并单击第二个选择框，获取相同的类首先选择框值

请给我解决这个问题的方法

任何帮助随时欢迎

这是我的jquery代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<table id="settable" class="table table-border">
    <tr>
    	<td class="col-md-3"><p><strong>Brand</strong></p></td>
    	<td class="col-md-3">
    	<select class="sel_item_specify form-control" rel="Brand" name="Brand">
    	<option class="add_textbox" value="Unbranded">Unbranded</option>
    	<option class="add_textbox" value="aden" +="" anais="">aden + anais</option>
    	<option class="add_textbox" value="Angelcare">Angelcare</option>
    	<option class="add_textbox" value="Babe" ease="">Babe Ease</option>
    	<option class="add_textbox" value="Babies&quot;R&quot;Us">Babies"R"Us</option>
    	<option class="add_textbox" value="Baby" banz="">Baby Banz</option>
       <option value="other">Enter your own</option></select> 
    	</select>
    	</td>
    	<td class="col-md-3"><input style="display:none;" name="Brand" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
    	<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
    </tr>
    
    <tr>
    	<td class="col-md-3"><p><strong>MPN</strong></p></td>
    	<td class="col-md-3">
    	<select class="sel_item_specify form-control" rel="MPN" name="MPN">
    	<option class="add_textbox" value="Does" not="" apply="">Does Not Apply</option>
    	<option value="other">Enter your own</option></select> 
    	</td>
    	<td class="col-md-3"><input style="display:none;" name="MPN" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
    	<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
    </tr>
    
    </table>
    package com.example.sachin.gps_currentlocation;

import android.Manifest;
import android.content.Context;
import android.content.pm.PackageManager;
import android.location.Criteria;
import android.location.Location;
import android.location.LocationListener;
import android.location.LocationManager;
import android.os.Bundle;
import android.support.v4.app.ActivityCompat;
import android.support.v7.app.AppCompatActivity;
import android.widget.TextView;
import android.widget.Toast;

public class GetCurrentGPSLocation extends AppCompatActivity implements LocationListener {

    LocationManager locationManager;
    String mprovider;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.current_gps_loaction);

        locationManager = (LocationManager) getSystemService(Context.LOCATION_SERVICE);
        Criteria criteria = new Criteria();

        mprovider = locationManager.getBestProvider(criteria, false);

        if (mprovider != null && !mprovider.equals("")) {
            if (ActivityCompat.checkSelfPermission(this, Manifest.permission.ACCESS_FINE_LOCATION) != PackageManager.PERMISSION_GRANTED && ActivityCompat.checkSelfPermission(this, Manifest.permission.ACCESS_COARSE_LOCATION) != PackageManager.PERMISSION_GRANTED) {
                return;
            }
            Location location = locationManager.getLastKnownLocation(mprovider);
            locationManager.requestLocationUpdates(mprovider, 15000, 1, this);

            if (location != null)
                onLocationChanged(location);
            else
                Toast.makeText(getBaseContext(), "No Location Provider Found Check Your Code", Toast.LENGTH_SHORT).show();
        }
    }

    @Override
    public void onLocationChanged(Location location) {
        TextView longitude = (TextView) findViewById(R.id.textView);
        TextView latitude = (TextView) findViewById(R.id.textView1);

        longitude.setText("Current Longitude:" + location.getLongitude());
        latitude.setText("Current Latitude:" + location.getLatitude());
    }

    @Override
    public void onStatusChanged(String s, int i, Bundle bundle) {

    }

    @Override
    public void onProviderEnabled(String s) {

    }

    @Override
    public void onProviderDisabled(String s) {

    }
}

4 个答案:

答案 0 :(得分：2)

在函数中使用$(this)对象来引用选择框

你可以尝试下面的代码

$('.sel_item_specify').change(function(){               
var getval = $(this).val();
alert('selectbox value  '+getval);
if(getval == 'other'){      
    $(this).closest("tr").find("button").show();
    $(this).closest("tr").find("input:text").show();                         
    $(this).closest("tr").find("input:text").attr('disabled',false);
    $(this).attr('disabled','disabled');                    
} 
else{
    $(".itemremove_btn").click(function(){                          
    $(this).hide();
    $(this).closest("tr").find("input:text").attr('disabled','disabled');
    $(this).closest("tr").find("select").attr('disabled',false);                            
    });
}

答案 1 :(得分：1)

您可以尝试这种简单的方式 

 $('.sel_item_specify').change(function(){   
 alert($(this).val());
   
});
<table id="settable" class="table table-border">
<tr>
    <td class="col-md-3"><p><strong>Brand</strong></p></td>
    <td class="col-md-3">
    <select class="sel_item_specify form-control" rel="Brand" name="Brand">
    <option class="add_textbox" value="Unbranded">Unbranded</option>
    <option class="add_textbox" value="aden" +="" anais="">aden + anais</option>
    <option class="add_textbox" value="Angelcare">Angelcare</option>
    <option class="add_textbox" value="Babe" ease="">Babe Ease</option>
    <option class="add_textbox" value="Babies&quot;R&quot;Us">Babies"R"Us</option>
    <option class="add_textbox" value="Baby" banz="">Baby Banz</option>
    </select>
    </td>
    <td class="col-md-3"><input style="display:none;" name="Brand" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
    <td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>

<tr>
    <td class="col-md-3"><p><strong>MPN</strong></p></td>
    <td class="col-md-3">
    <select class="sel_item_specify form-control" rel="MPN" name="MPN">
    <option class="add_textbox" value="Does" not="" apply="">Does Not Apply</option>
    <option value="other">Enter your own</option></select> 
    </td>
    <td class="col-md-3"><input style="display:none;" name="MPN" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
    <td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>

</table>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

答案 2 :(得分：1)

使用

var getval = $(this).val();

而不是

var getval = $(".sel_item_specify option:selected").val();

JSFiddle

<强>更新

如果您想要触发按钮的点击事件，如果选择的值不是＆＃34;其他＆＃34;那么你的代码应该是这样的：

$(".itemremove_btn").click(function() {
    $(this).hide();
    $(this).closest("tr").find("input:text").attr('disabled', 'disabled');
    $(this).closest("tr").find("select").attr('disabled', false);
});

$('.sel_item_specify').change(function() {
    //var getval = $(".sel_item_specify option:selected").val();

    var getval = $(this).val();

    alert('selectbox value  ' + getval);
    if (getval == 'other') {
        $(this).closest("tr").find("button").show();
        $(this).closest("tr").find("input:text").show();
        $(this).closest("tr").find("input:text").attr('disabled', false);
        $(this).attr('disabled', 'disabled');
    } else {
        $(".itemremove_btn").click();
    }
});

JSFiddle

答案 3 :(得分：1)

您的问题不够明确，但如果您打算捕获集合中各个项目的价值。或者在您拥有相同属性的多个元素的情况下，您可以像这样简单地进行操作。

    
    //Any item/element with this class falls into this group
    $('.td_group').each(function () {
        $(this).on("change", function () {
          //some custom attribute to uniquely identify each td or some element in the group
          var optionID = $(this).attr('option_id'); 
          ....
          //You can do as you desire, operating on individual items in the group
          ....
        });
    });

相关问题
最新问题