Javascript显示更多按钮
当有人按下Show More来获取按钮的id,如果id以“Show\u More\u id\u”开始获取id的数量,然后以“Box\u Show\u id\u”来显示更多或更少,我会尝试制作脚本 示例ID/类:Javascript显示更多按钮,javascript,jquery,Javascript,Jquery,当有人按下Show More来获取按钮的id,如果id以“Show\u More\u id\u”开始获取id的数量,然后以“Box\u Show\u id\u”来显示更多或更少,我会尝试制作脚本 示例ID/类: <div class="Box_Show_ID_1"></div> <input type="button" id="Show_More_ID_1" value="Show More" /> 这是我现在做的代码,但不起作用 如果是一个链接,或者应
<div class="Box_Show_ID_1"></div>
<input type="button" id="Show_More_ID_1" value="Show More" />
这是我现在做的代码,但不起作用
如果是一个链接,或者应该显示另一个div,JSFiddle并没有真正指出您想要显示更多按钮 如果您将id更改为ShowMoreID_1,则会更容易:
$('button').click(function(e) {
e.preventDefault();
var val = $(this).attr('id');
var str = val.split('_');
if(str[0] == 'ShowMoreID') {
var id = str[1];
// do stuff
} else {
// dont do stuff
}
});
更新为包含jQuery库。我将其调整为我认为您想要做的:
这个演示怎么样?演示
var orgContent=$('.extract').html();
var txtContent=$('.extract').text().substr(0,50)+'。。。“更多”;
$('.extract').html(txtContent);
$(“正文”)。在(“单击”上,“#morelink”,函数(){
$('.extract').html(orgContent);
$('less').appendTo('extract');
});
$(“body”)。在(“click”上,“#lesslink”,function(){
$('.extract').html(txtContent);
});
实际上,您从错误的索引中获取id
var Box_Data_ID=ID_Split[3]代码>似乎复杂程度超出了实际需要。看看这个。我对您的HTML进行了一些更改,添加了一个jQuery库(您将其标记为JavaScript,但正在编写jQuery),并添加了一个click()函数:
小提琴:
你的小提琴中的image\u id
是什么?你的小提琴没有选择jQuery库。还有,什么是“图像id”?对不起,图像id.split(“”);需要是框ID。拆分(“”)。。。我得到了一个脚本,我试图转换为我需要的…我尝试了你的代码,但没有与我所做的更改工作。。。你能检查一下有什么问题吗。。。谢谢
var orgContent = $('.excerpt').html();
var txtContent = $('.excerpt').text().substr(0, 50) + '... <a id="morelink">more</a>';
$('.excerpt').html(txtContent);
$("body").on("click", '#morelink', function(){
$('.excerpt').html(orgContent);
$('<a id="lesslink"> less</a>').appendTo('.excerpt');
});
$("body").on("click", '#lesslink', function(){
$('.excerpt').html(txtContent);
});
$('.btn').click(function(){
this_id = $(this).attr('id');
$('.Box_Show_ID_'+this_id).toggle();
});
$(document).ready(function(){
var Box_Data_MSG_1 = "Show More";
var Box_Data_MSG_2 = "Show Less";
var Box_Data_Height = "117px";
$("input[id*='Show_More_ID_']").click(function() {
var Box_ID = $(this).attr("id");
var ID_Split = Box_ID.split('_');
var Box_Data_ID = ID_Split[ID_Split.length-1];
var Box = ID_Split[2];
var Button_Value = $('#Show_More_ID_' + Box_Data_ID).attr("value");
if(Button_Value == Box_Data_MSG_1) {
$('#Show_More_ID_' + Box_Data_ID).attr('value', Box_Data_MSG_2);
}
});
});