PHP多读少读- Magento 2
PHP多读少读- Magento 2
提问于 2018-07-26 14:24:51
我为我的Magento 2网店做了一个多读少读脚本。这是在类别页面上使用的，其中有要选择的serval子类别块，每个子类别都有一个描述。
问题:如果我单击“读更多”，那么所有的子类别的描述都会扩展，而不是只扩展子类别的描述，单击“读更多”
我开始学习PHP和Magento 2，但是我不能解决这个问题，有人知道解决方案吗？
<div class="product description product-item-description">
<div class="more">
<?php if ($_subCategory->getDescription()) {
$string = strip_tags($_subCategory->getDescription());
if (strlen($string) > 250) {
// truncate string
$stringCut = substr($string, 0, 250);
$string = substr($stringCut, 0, strrpos($stringCut, ' ')).'... <a href="javascript:void(0);" class="readmore">Lees meer</a>';
}
echo $string;
?>
</div>
<?php
}else {?>
<?php /* @escapeNotVerified */ echo $_attributeValue;
}
?>
</div>
<div class="less" style="display:none">
<?php echo $_subCategory->getDescription(); ?>
<a href="javascript:void(0);" class="readless">Lees minder</a>
</div>
<script type="text/javascript">
console.log('test');
require(["jquery"],function($){
$('.readmore').on("click",function(){
$('.less').show();
$('.more').hide();
});
$('.readless').on("click",function(){
$('.less').hide();
$('.more').show();
});
});
</script>
</div>回答 1
Stack Overflow用户
发布于 2018-07-26 14:57:38
这是因为，当您键入$('.less').hide();时，这将使用属性class='less'获取每个元素。这就是我克服这一问题的方法：
首先，向每个<div class="more">或<div class="less">附加一个唯一属性--在本例中，我们使用类属性：(并将“多”或“较少”移动到id)
<div id="read-more-block" class="cat-<?php echo $_subCategory->getId(); ?>">
<!-- my "read more" content -->
<a class="link" href="#read-more-block">Read Less</a>
</div>
<div id="read-less-block" class="cat-<?php echo $_subCategory->getId(); ?>">
<!-- my "read less" content -->
<a class="link" href="#read-less-block">Read More</a>
</div>现在每个子类别都有一个read-more-block和一个read-less-block。当我们单击内部链接时，会触发一个jQuery事件，它将隐藏自己并显示另一个事件。
然后，在你的jQuery中：
$('#read-more-block .link').on('click', function() {
var $readLessBlock = $('#read-less-block.' + $(this).parent().attr('class'));
$readLessBlock.show(); //Show the read less block
$(this).parent().hide(); //Hide the read more block
});..and反之亦然，因为读得少。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51541200
复制相关文章
相似问题
腾讯云开发者
