rows
="10"
cols
="30"
v-on:keydown
="tabhandle"
v-model
="content"
>
textarea
>
style
="height
: 60vh;
border
: 1px solid #ccc;
padding-left
: 50px;
overflow-y
: auto
" >
style
="list-style
: decimal;
background
: #f8f8f8;
" v-for
="(j, index) in formatjsonlist"
:key
="index"
>
style
="margin:0"
>
}pre
>
li>
ol>
new
vue(
, watch:
this
.$set
(this
,'formatjsonlist',[
])},
deep:
true},
},methods:
// 只是按了tab,直接插入空格就可以了
this
.inserttext
(e.target,
' '
) e.returnvalue =
false}}
,// 插入空格
inserttext
(el, str)
elseif(
typeof el.selectionstart ===
'number'
&&typeof el.selectionend ===
'number'
)// 如果文字域內容被選中了,需要在選中的內容裡加入空格
let selectionstr = tmpstr.
substring
(startpos, endpos)
let newstr =
''// 把選中的內容新增對應的空格填充
selectionstr.
split
('\n').
foreach
((e, index)
=>
)// 改變為新值
el.value = tmpstr.
substring(0
, startpos)
+ newstr + tmpstr.
substring
(endpos)
// 選中當前編輯的內容
this
.selectioncontent
(el, startpos, startpos + newstr.length)
return
}else
this
.movecursor
(el, el.value.length)},
// shift和tab同時按下
shifttabhandle
(el)
$)/g,''
)}elseif(
typeof el.selectionstart ===
'number'
&&typeof el.selectionend ===
'number'
)$)/g,''
) cursorpos = reversestr.length
el.value = reversestr + tmpstr.
substring
(startpos, tmpstr.length)
el.selectionstart = el.selectionend = cursorpos
this
.movecursor
(el, cursorpos)
return
}// 獲取到選中的內容
let selectionstr = tmpstr.
substring
(startpos, endpos)
let newstr =
''// 把選中的內容切成陣列,並去除陣列內的前兩個空格
const selectionstrarray = selectionstr.
split
('\n'
) selectionstrarray.
foreach
((e, index)
=>)/,
'\n'
): e.
replace
(/(^\s)/,''
)})// 改變為新值
el.value = tmpstr.
substring(0
, startpos)
+ newstr + tmpstr.
substring
(endpos)
// 選中當前編輯的內容
this
.selectioncontent
(el, startpos, startpos + newstr.length)
return
}else
$)/g,''
)}this
.movecursor
(el, el.value.length)},
// 移動游標
movecursor
(el, topos)
elseif(
typeof el.selectionstart ===
'number'
&&typeof el.selectionend ===
'number')}
,// 選中內容
selectioncontent
(el, start, end)
else
if(el.createtextrange)},
// 格式化json
formatjson()
if(this
.content.
trim()
===''
)// 驗證一下json內容是否正確
trycatch(e
))return
}this
.content =
json
.stringify
(detail,
null,2
)},}
})
json內容獲取的方法比較簡單,就沒有在上面寫出,可以直接通過「json.parse(this.content)」獲取到。
**自測沒有問題,如果發現有問題的話,歡迎指正。
原生js格式化json和格式化xml的方法
在工作中一直看各位前輩的部落格解決各種問題,對我的幫助很大,非常感謝!之前一直比較忙沒有寫部落格,終於過年有了點空閒時間,可以把自己積累的東西分享下,筆記中的部分函式不是自己寫的,都是工作中一點點積累的,由於時間已久比較零散找不到對應的主人了,沒法註明出處還請見諒。我們經常遇到從後代拿到的沒有格式化...
寫乙個json格式化工具
準備 用js來寫 頁面操作元素就用jquery 頁面排版就用bootstrap。1 對於單純格式化json的話,只需要 var jsonchar key4 var jsonobj json.parse jsonchar var jsonfmt json.stringify jsonobj,null,...
js實現日期格式化
function format now,mask return zeros value return mask.replace b d m yy yy hhmstt 1?llz b g,function 0 使用時候直接呼叫方法 format date,yyyy mm dd hh mm 輸出格式為 ...