Home >Web Front-end >JS Tutorial >jQuery operates iframe to add and delete windows
This time I will bring you the jQuery operation to add or delete iframe windows. What are the precautions for jQuery to operate iframe addition and deletion windows? . The following is a practical case, let's take a look.
I encountered a problem today: How to click a button to add a new small window to the current page to display a picture information?
As shown below:
Before clicking:
After clicking :
Analysis: To prevent the newly added small window from affecting the parent page, we use the iframe framework technology here.
[
The implementation idea is: (1) Add a click event to the button, add an iframe window after clicking, and add the address of the generated image.
Specific implementation code:
(1) Add a click event to the button:
<input type="radio" name="dynamicType" id="dianji" style="padding: 0 10px 0 5px;margin-left:10px;margin-top: 13px;"/> <p class="loadPhoto"></p> $("#dianji").click(function(){ $("p.loadPhoto").empty(); // 清空原来的p标签的中内容 $("p.loadPhoto").html("<iframe width=520 height=400 name=\"touzizuhe\" id=\"touzizuhe\" frameborder=0 src="生成图片的地址"></iframe>");// 添加iframe的jquery的语句 });
I believe you have mastered the method after reading the case in this article. Please pay attention for more exciting things. Other related articles on php Chinese website!
Recommended reading:
Tab scroll navigation switching implementation (with code)
jQuery Ajax implementation of table data title Sort
The above is the detailed content of jQuery operates iframe to add and delete windows. For more information, please follow other related articles on the PHP Chinese website!