我在使用javascript时遇到了一个问题 onchange 事实上，我有一个用cakephp3.7构建的电子商务网站应用程序运行良好。现在我想增强网站中的销售提交表单，通过动态加载额外的字段，让卖家根据以下内容填写 种类 的产品，卖家选择。也就是说，如果卖家选择了 electronic 的类别输入字段，然后将以前的电子exta字段的样式为 display:none 现在将显示在CSS中的电子额外字段。id=elctronic:
<div id="electronic">
<?php echo $this->Form->control('subcategorie',['label'=>'choose sub category', 'class'=>'form-control', 'option'=>['Computer','Phone','Multimedia'],'empty'=>'choose'); ?>
<?php echo $this->Form->control('brand',['class'=>'form-control', 'placeholder'=>'the brand']); ?>
<?php echo $this->Form->control('model',['class'=>'form-control', 'placeholder'=>'the model']); ?>
</div>
那么如果产品是关于 clothes 例如 electronic 输入字段将被隐藏，而衣服的额外字段将被显示，并带有 id=clothe 如波纹状。
<div id="clothe">
<?php echo $this->Form->control('Gender',['label'=>'What gender?', 'class'=>'form-control', 'option'=>['Males','Females'],'empty'=>'choose'); ?>
<?php echo $this->Form->control('Size',['class'=>'form-control', 'placeholder'=>'Size']); ?>
<?php echo $this->Form->control('model',['class'=>'form-control', 'placeholder'=>'the model']); ?>
</div>
该 种类 输入字段，其中 onchange 事件监听器的使用方法如下图所示，JavaScript函数为 extraForm() 应该被调用，但它没有，这就是问题所在。
<?php echo $this->Form->control('category',['id'=>'categ','label'=>'choose category', 'class'=>'form-control', 'options'=>['electronics','clothes'],'empty'=>'choose'),'onchange'=>'extraForm("categ"); ?>
在ProductsController的方法add()的布局中 我设置了extraForm()函数，如下图。
<script>
function extraForm(s1){
var s1=documentgetElementById(s1);
var s2=documentgetElementById("electronics");
var s3=documentgetElementById("clothes");
if(s1.value == "electronics"){
s2.style.display = "bloc"
} else {
s3.style.display = "bloc"
}
}
</script>
到现在已经三天了，我也没弄明白自己到底缺了什么。Yesterday I searched through the net and there were people saying that event listener such as onchange, onclick and onselect event listeners are deprecated for cakephp 3 and I don't understand how. 那么如何在cakephp3.7中实现选中选项触发额外输入表单的动态加载。
**
**
就像我在评论中说的那样，我把问题简化了，使其易于理解。完整的上下文是，我有2个标准字段。category 和 subcategory. 当用户选择一个类别时，一个 AJAX 功能为用户提供了一个子类别列表，供用户选择。我的AJAX是
$(document).ready(function(){
$('#getSubCat').change(function(e){
$.ajax({
type: "POST",
url: "/products/getsubsaterogie",
data: {categ: $(this).find('option:selected').text()},
dataType: 'json',
cache: false,
headers : {
'X-CSRF-Token': $('[name="_csrfToken"]').val()
},
success: function(data){
console.log(data);
let subcat = $('#subcategories')
for (let sc of data) {
console.log(sc.subcategorie)
$('<option />', {value: sc.subcategorie_id, text: sc.subcategorie}).appendTo(subcat);
}
}
});
e.preventDefault();
})
})分类输入字段为。
<?php echo $this->Form->control('categorie_id', ['id'=>'getSubCat', 'options' => $categories, 'label' => __("What category ?"), 'class'=>'form-control', 'empty' => '(choose)']);
?>
当用户选择一个类别后，AJAX从数据库中获取的子类别列表就会很好地出现在这个表单输入中，这就是 onchange 被设置为调用 extraForm() 功能，但没有。
<?php echo $this->Form->control('subcategorie_id', ['id'=>'subcategories', 'label' => __("What subcategory ?"), 'class'=>'form-control', 'options'=> [],'empty' => '', 'onchange' => 'myFormShow("getSubCat","subcategories")']);
?>
而且在选择了子类之后，相关的额外表格并没有出现，但是如果我手动更改了一下 display 到 bloc 在CSS中，它确实显示出来了，这意味着javascript函数没有被调用onchange事件，我甚至用了 onselect 但仍然没有.而且javascript函数extraForm实际上接收了2个参数，如 extraForm(s1, s2). 这是我真正的背景。
我真的卡在这里了。任何帮助真的很感激，先谢谢你。
- EDIT ACCORDING TO GREG'S REQUEST:根据Greg的评论，这是我的蛋糕代码，用来生成子类内的列表。我不知道这些细节是必要的，因为我以为是cakephp 3关于javascript事件监听器的问题。
public function getsubsaterogie(){
if($this->request->is('ajax')){
$d = $this->request->getData();
$subcat = '';
$cat = TableRegistry::get('Categories')->find()
->where(['categorie' => $d['categ']])
->select('id')
->first();
if(!empty($cat)){
$subcat = TableRegistry::get('Subcategories')->find()
->where(['categorie_id' => $cat->id])
->all();
}
echo json_encode($subcat);
exit();
}
}
先谢谢你了，问候!
不知道真正的问题是什么，这总是让人很畏惧，因为这不是我第一次尝试用 jax 与...一起 cakephp。 我可以证明 Greg Schmidth 爽快 "子类目根本无法显示"。 事实上，2天后，当努力寻找真正的问题时。
而突然间，整个应用开始出现意外的行为。
子类别没有显示更多的内容。
我在网站前台做的基于jQuery的广告动画代码也变得很奇怪。
这些都让我想到了jQuery的问题，事实上这才是真正的问题。我使用了3个不同版本的jQuery，而这3个版本都是我的项目所需要的。这3个jquery版本默默地冲突着，也没有给我任何线索来排查问题。现在我知道是jquery的问题，我使用了jQuery noConflict的方法，描述在 这个环节
<?= $this->Html- >script('http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js') ?>
<?= $this->Html->script('lecker/ajax/getSubCategorie.js') ?>
<script>
var jQuery_1_12 = $.noConflict(true);
</script>
<?= $this->Html->script('https://code.jquery.com/ui/1.12.1/jquery-ui.js') ?>
// This for the second jquery version
描述并不像看起来那么简单，但其他问题上。叠叠乐 也帮助我。
归根结底，这不是一个关于cakephp第三版表单助手是否还能使用enchange事件的问题，而是一个关于正确的 $ jquery在ajax代码中使用的变量来获取子类别，但没有产生。