编辑商品页面跳转并回填

页面跳转并回填

主要功能：

​ 点击列表项，进入编辑页面，完成编辑，点击保存，跳转，并将编辑框中内容回填到父页面相应位置。

效果图：

主要思路：

​ 点击相应相应列表项，跳转到新页面，编辑内容，获取到输入框中的内容，保存到sessionStorage中，点击保存，返回到父页面，读取sessionStorage内容，并在相应位置显示。

主要代码：

<!--列表页-->
<ul class="storeMana">
	<li class="edit">
		<span class="li-left">商品分类</span>
		<span class="li-right iconfont icon-you3"></span>
		<div class="backFill" id="goodsClassify"></div>
	</li>
	<li class="edit">
		<span class="li-left">商品描述</span>
		<span class="li-right iconfont icon-you3"></span>
		<div class="backFill" id="goodsDescribe"></div>
	</li>
	<li class="edit">
		<span class="li-left">商品标签</span>
		<span class="li-right iconfont icon-you3"></span>
		<div class="backFill" id="goodsTag"></div>
	</li>
</ul>

//列表页
<script type="text/javascript">
    $(".storeMana .edit").each(function(){
    	var ids = $(this).find('.backFill').attr('id');
        $(this).click(function(){
        	location.href = "textarea.html?id="+ids;
        });
    	var aa = sessionStorage.getItem(ids);
    	$(this).find(".backFill").text(aa);
    })
</script>

<!--编辑页-->
<div class="wrap">
	<textarea id="introduce"></textarea>
</div>

//编辑页
<script type="text/javascript">
    //获取用户输入的内容
    var idName = location.search.substring(4);
    $('.save').click(function() {
        var info = $("#introduce").val();
        sessionStorage.setItem(idName,info);
        history.go(-1);
    })
</script>

---

应该还有别的办法，但是现在的我暂时只知道这个。。。希望有知道的朋友，一起讨论~~