我有一个复选框，选中后，其他多个字段可供用户输入数据。
现在我有很多这样的事情，处理每一个的检查事件变得越来越困难，所以我创建了一个onclick事件来监听类的检查事件。
<table>
<tr>
<td>
<label class="app-form-label">
<input type="checkbox" name="Sem1CourseOffer" id="chkSem1CourseOffer" class="disableEnableField" value="Semester 1">Semester 1</label>
</td>
<td>
<div style="float:left">
<label style="display:block">
<input type="checkbox" name="Sem1CourseOfferMode" disabled="disabled" value="Face to Face" class="enableDisable1">Face to Face</label>
<label style="display:block">
<input type="checkbox" name="Sem1CourseOfferMode" disabled="disabled" value="Print" class="enableDisable1">Print</label>
<label style="display:block">
<input type="checkbox" name="Sem1CourseOfferMode" disabled="disabled" value="Blended" class="enableDisable1">Blended</label>
<label style="display:block">
<input type="checkbox" name="Sem1CourseOfferMode" disabled="disabled" value="Online" class="enableDisable1">Online</label>
<label style="display:block">
<input type="checkbox" name="Sem1CourseOfferMode" disabled="disabled" value="Other" class="enableDisable1">Other</label>
</div>
<textarea name="Sem1CourseOfferModeComment" id="txtSem1CourseOfferModeComment" disabled="disabled" class="control-label enableDisable1" style="width: 50%; margin-left:20px; height:100%"></textarea>
</td>
</tr>
<tr>
<td>
<label class="app-form-label">
<input type="checkbox" name="Sem2CourseOffer" id="chkSem2CourseOffer" class="disableEnableField" value="Semester 2">Semester 2</label>
</td>
<td>
<div style="float:left">
<label style="display:block">
<input type="checkbox" name="Sem2CourseOfferMode" disabled="disabled" value="Face to Face" class="enableDisable2">Face to Face</label>
<label style="display:block">
<input type="checkbox" name="Sem2CourseOfferMode" disabled="disabled" value="Print" class="enableDisable2">Print</label>
<label style="display:block">
<input type="checkbox" name="Sem2CourseOfferMode" disabled="disabled" value="Blended" class="enableDisable2">Blended</label>
<label style="display:block">
<input type="checkbox" name="Sem2CourseOfferMode" disabled="disabled" value="Online" class="enableDisable2">Online</label>
<label style="display:block">
<input type="checkbox" name="Sem2CourseOfferMode" disabled="disabled" value="Other" class="enableDisable2">Other</label>
</div>
<textarea name="Sem2CourseOfferModeComment" id="txtSem2CourseOfferModeComment" disabled="disabled" class="control-label enableDisable2" style="width: 50%; margin-left:20px; height:100%"></textarea>
</td>
</tr>
</table>
这里我有2个复选框，类disableEnableField。每个复选框禁用其他元素（4个复选框，1个textarea，所有类都带有enableDisable [i]）
现在我的Javascript来处理2个主要复选框的点击事件
$(function () {
$(".disableEnableField").change(function () {
if ($(this).is(':checked')) {
$('.enableDisable1').prop("disabled", false)
} else {
$('.enableDisable1').prop("disabled", true)
}
});
});
以下是我的设置的工作演示（功能不正确）：https://jsfiddle.net/normangr7/Lckjcr9u/1/
通过演示，如果单击semester1，则正确的相应元素会更改其disable属性。但是对于semester2，它不正确，因为我对属性进行了硬编码。我需要一种方法让onclick获取复选框需要更改的相应元素。也许是通过元素的属性？
答案 0 :(得分：1)
你可以做到以下几点：
你已经完成了第一名。
第二个可以通过复选框
的数据属性实现public class CameraActivity
extends Activity
implements SurfaceHolder.Callback {
private LayoutInflater myInflater = null;
Camera myCamera;
byte[] tempdata;
boolean myPreviewRunning = false;
private SurfaceHolder mySurfaceHolder;
private SurfaceView mySurfaceView;
Button takePicture;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFormat(PixelFormat.TRANSLUCENT);
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_camera);
mySurfaceView = (SurfaceView) findViewById(R.id.surface);
if (mySurfaceHolder == null) {
mySurfaceHolder = mySurfaceView.getHolder();
}
mySurfaceHolder.addCallback(this);
mySurfaceHolder.setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS);
myInflater = LayoutInflater.from(this);
View overView = myInflater.inflate(R.layout.second_layer_camera,null);
this.addContentView(overView, new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT));
takePicture = (Button) findViewById(R.id.button);
takePicture.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
myCamera.takePicture(myShutterCallback, myPictureCallback, myJpeg);
}
});
}
ShutterCallback myShutterCallback = new ShutterCallback() {
@Override
public void onShutter() {
}
};
PictureCallback myPictureCallback = new PictureCallback() {
@Override
public void onPictureTaken(byte[] data, Camera myCamera) {
}
};
PictureCallback myJpeg = new PictureCallback() {
@Override
public void onPictureTaken(byte[] data, Camera myCamera) {
if(data != null){
tempdata = data;
done();
}
}
};
void done(){
Bitmap bm = BitmapFactory.decodeByteArray(tempdata, 0, tempdata.length);
String url = Images.Media.insertImage(getContentResolver(), bm, null, null);
bm.recycle();
Bundle bundle = new Bundle();
if(url != null){
bundle.putString("url",url);
Intent mIntent = new Intent();
mIntent.putExtras(bundle);
setResult(RESULT_OK, mIntent);
}
else{
Toast.makeText(this, "Picture can not be saved", Toast.LENGTH_SHORT).show();
}
// finish();
myCamera.startPreview();
}
@Override
public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
try{
if(myPreviewRunning){
myCamera.stopPreview();
myPreviewRunning = false;
}
Camera.Parameters p = myCamera.getParameters();
p.setPreviewSize(width,height);
myCamera.setParameters(p);
myCamera.setPreviewDisplay(holder);
myCamera.startPreview();
myPreviewRunning = true;
}catch(Exception e){}
}
@Override
public void surfaceCreated(SurfaceHolder holder) {
myCamera = Camera.open();
}
@Override
public void surfaceDestroyed(SurfaceHolder holder) {
// TODO Auto-generated method stub
myCamera.stopPreview();
myPreviewRunning = false;
myCamera.release();
myCamera = null;
}
}
并且泛型函数应该执行类似
的操作<input type="checkbox" name="Sem2CourseOffer" data-trigger-class="enableDisable2"...
HTH
答案 1 :(得分：1)
这将启用或禁用下一个单元格中的所有元素：
$(function () {
$(".disableEnableField").change(function () {
if($(this).is(':checked')) {
$(this).closest('td').next('td').find('*').prop("disabled", false);
} else {
$(this).closest('td').next('td').find('*').prop("disabled", true);
}
});
});